I'm working on a PHP-generated HTML TreeView 'control' that needs to be compatible with (at least) IE7 and Firefox 2.
My TreeView isn't rendering properly on IE7, and I've simplified the problem in the example below. Basically, the vertical-align properties of the 'image' divs and 'label' divs are causing unwanted additional vertical space (about 2 pixels) between the images.
This is a screenshot from Firefox, which renders exactly as I want it (where the JPEGs are directly on top of each other with no grey gaps); and this is what IE7 gives me.
Please note: whitespace in the body screws up this design -- don't let anyone ever tell you whitespace doesn't matter!
font-family: arial, helvetica, sans-serif;
<body><div class="container"><div class="image"><img src="http://milkherder.co.uk/cvs/tree/images/home.gif" /></div><div class="label">One</div><br /><div class="image"><img src="http://milkherder.co.uk/cvs/tree/images/home.gif" /></div><div class="label">Two</div></div></body>
Any help would be much appreciated!