I've been experiencing a weird rendering issue in my site. After messing around with the HTML and using Safari's Web Inspector, I found the issue was recreate-able...
<div class="clear"/>
<p>This doen't work</p>
<div class="clear"></div>
<p>This does</p>
<br class="clear" />
<p>This does</p>
Webkit browsers like Safari (and Google Chrome) took it upon themselves to output the following HTML...
<div class="clear">
<p>This doen't work</p>
<div class="clear"></div>
<p>This does</p>
<br class="clear" />
<p>This does</p>
</div>
Nasty. Or so I thought. After researching online, I found a great little post. There are only 10 HTML tags that can be empty. Basically webkit is rendering exactly how the XHTML spec says it should be rendered.
As a result, I booted up textPad and did a file search on the following...
<[^area|^base|^br|^col|^hr|^img|^input|link|^meta|^param]+[^>]*/>
Which reads - "Find me all tags that are not one of the legally allowed empty tags"
Quite nice, unless you use a tag based language to develop your site in (dot net, coldfusion)... it'll match all your empty asp.net tags as well.
<asp:textBox id="txtEmail" runat="server" />We'll let's invert it and say "All empty tags that are valid XHTML tags, but not valid to be empty."
<[a|abbr|acronym|address|applet|b|bdo|big|blockquote|body|button|caption|cite|code|colgroup|dd|del|dfn|div|dl|DOCTYPE|dt|em|fieldset|form|frame|frameset|h1|h2|h3|h4|h5|h6|head|html|i|iframe|ins|kbd|label|legend|li|map|noframes|noscript|object|ol|optgroup|option|p|pre|q|samp|script|select|small|span|strong|style|sub|sup|table|tbody|td|textarea|tfoot|th|thead|title|tr|tt|ul|var][ ]+[^>]*/>
And went through the task of closing all the tags. I guess you should expect rendering issue if you don't conform to web standards.