If your HTML requires a non-self-closing HTML tag which has no content between the opening and closing tag like this:
<span class="overlay"></span>
Then you will find that if you put the above in an XSLT it will get transformed to:
<span class="overlay" />
Which may not display as expected in your browser.
To get the correct code to be output you can do one of the following:
<span class="overlay"><xsl:text> </xsl:text></span>
<span class="overlay"><xsl:value-of select="''"/></span>
<xsl:text disable-output-escaping="yes"><span class="overlay"></span></xsl:text>
<xsl:text disable-output-escaping="yes"><![CDATA[<span class="overlay"></span>]]></xsl:text>
Another solution is to use <xsl:comment>
<span class="overlay"><xsl:comment></xsl:comment></span>
or if you want to avoid the "<!---->"
<span class="overlay"><xsl:value-of select="normalize-space('')"/></span>
Another approach is to change the output to html
<xsl:output method="html" omit-xml-declaration="yes"/>
However - this might not be the best solution since it creates <input> <br> and <img> tags without closing /.
The easilest thing I've found is just to put a simple non-breaking space between the tags, so something like...
<div class="clear"> </div>