What am I doing wrong? IE driving me insane!

[puffnstuff]

Ok, so I did a home page, in what I think is mostly CSS, getting rid of the old nested tables layout.

Looks great in all browsers (FF, Netscape, Safari), but NOT in IE.

In IE, there are strange gaps near the top, between the different DIVs. Actually IE7 only shows 1 gap, but IE6 is even worse and shows 3 gaps between different DIV's.

I have a feeling it has something to do with margins or padding, but I've tried everything I can think of, and nothing seems to make a difference.

Does anybody know what I'm missing here?

Sorry to be a pain in the arse noobie, but we all have to start somewhere and learn, right?

Here's the page:

http://bossteel.com/indexGHS.html

[puffnstuff]

Wow, I think it's resolved.

I added display:block to the images that are at the top of the page, and it looks ok in IE now. The attribute has to be added inline, because putting it in the stylesheet had no effect. Odd. I wonder if anybody has any explanation for this?

So, in other words, I had to add into the html: <div id="section2"><img style="display:block;" src="images/mypicture.jpg"></div>


I thought I would delete this post, but maybe it should stay up incase others have a similar problem.