replacing tables with css

[Free Indeed]

I am putting a new site together and after I started it, I got into learning css/xhtml. However, I am having a horrible time figuring out how to control the page layout without my beloved tables. Here is where I was at so far USING tables for page layout: New siteSo, in order to switch to css I set up this page to work on the positioning and page layout. I basically set up a 3 column layout with header and footer - which I think should work in the end. My problem is the spaces that are being added here and there. I can't splice images together and lock the layout in with extra spaces added after the images. I've tried several things using classes and id's to clear, but no luck. How do I get a <div> to wrap tight around an image? Thanks for any help!

[thescientist]

which image are you referring to? the header? if you want to use clear, use clear: somevalue. maybe if you could explain what about your current layout you want to behave differently.

[ShadowMage]

I think the issue might be with default margins/padding that are applied to different elements. Try using a CSS reset:

* {   margin: 0px;   padding: 0px;}

Edit: Put this at the very top of your CSS stylesheet, before anything else.

[jeffman]

What are the spans for?Try floating your image elements. Some browsers might reject that if you don't also change their display property to inline-block. I forget.

[dsonesuk]

change the spans to divs then assign line-height of 0 example<div style="line-height:0;"><img src="comp/henrich-banner.png"/></div>