White Space Killing CSS Layout
After a longer-than-I-want-to-admit session of reconciling CSS rendering problems where <li> items were mysteriously 3px lower in Webkit (Chrome& Safari) and Internet Explorer, but not Mozilla (FF4 beta 3), I was reminded, and hopefully will remember this time that:
- item 1
- item 2
- item 3
- item 4
<ul>
<li>item 1</li>
<li>item 2</li>
<li>item 3</li>
<li>item 4</li>
</ul>
on all browsers, is not equal to:
- item 1
- item 2
- item 3
- item 4
<ul><li>item 1</li><li>item 2</li><li>item 3</li><li>item 4</li></ul>
Friggin' white spaces with a non-zero height pushing my items down. Bah!


@martin: I should have put more details up with this post along with screen shots and real code snippets - I was lazy. Anyway, using:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitiona...; >