IE, gaps in sections, help!

[Syntax Error]

Ok so my DOD clan wanted to redesign the homepage of our site, and guess who they put in charge. I made a template, sliced it, coded it etc. It looks great in Firefox. But, in IE everything is messed up. My auto-expanding menus and such have big gaps between the middle image and the top/bottom images. So, I decided to make two different CSS stylesheets, one for IE, and one for all other browsers. I've tried everything I can think of to make the images match up in IE and I just cant do it. You can view the site here ::

Thanks.

[edited by: SuzyUK at 5:09 pm (utc) on July 25, 2005]
[edit reason] Please no URLs : see TOS #13 [WebmasterWorld.com] [/edit]

[SuzyUK]

Hi Syntax Error and Welcome to the Forums

an image is an inline element and by default works like a line of text where default line-height produces "gaps" above and below the image which if it were inline text would be the space for the ascenders and descenders of letters like p, d, j, b etc..

you could try making the offending images all {display: block;}, try adding
img {display: block;}
to your stylesheet for a start to see if that works, but note that that will affect every image on the page which might upset other things..

Suzy

[Syntax Error]

Thanks so much! That fixed it. I've had problems like this before, and now I remember the solution is in the display type. Thanks again.