Hi,

I am new to css. Presently, I am trying to create one table with one image in one td. Image and table are the same size. However, there remains a small area around the image showing the red bgcolor, which I would like to eliminate. Basically, the img should fill the full td (the red bgcolor is for troubleshooting only)

External css:
table.banner {width: 900px; height: 228px; vertical-align: top; padding: 0px; margin: 0px; margin-left: auto; margin-right: auto; background-color: red; border: 1px black solid; border-collapse: collapse;}
/* the border-collapse decreases the red area by half*/
HTML:
<table class="banner">
<tr>
<td><img src="image.png" width="900" height="228" alt="logo" />
</td></tr></table>

Consequently, I would like to add floating text as nav. links on top of the image.

thanks,

Why use a table at all??? Using tables for layout is not the best method at all.

I use them because they are simple and straight forward (width=x, hight=y, align=something). Every browser understands it and renders it correctly in the same way.
In addition, I should know this. I know Html very well, but am having beginner problems with Css - too many choices and wild cards, etc. It will take time to get a thorough understanding.
AND, yes you are right, there are many ways to pluck a chicken, some are better, some are worse.

In this instance I would like to create 3 fixed width tables:
top-table banner with floating text links on image,
mid-table containing left vertical nav. bar + main display
and a footer with text links.
Text (+links) will change over time, so I don't want to lock myself into images for now.

But I am all ears for better ways of doing things. (simplicity is key, my key).The same effect in html would take me one hour tops, including slicing the banner. In Css, ...still looking at the thin red bgcolor after 6 hours of research on this topic alone and I have not figured out yet how to properly place the text links in this banner, etc.

thanks, samj
BTW: your response was lightning fast. :-)

Well.. using tables for layout weighs down your page, among other things, and with current versions of IE, the cross-browser headaches are far, far less, just takes some minor tweaking.

Do you have the page available so we can actually see it?

Ok.. add this to your CSS:

table.banner td{
padding: 0;
margin: 0;
font-size: 0;
}

The key there, with IE, is the font-size: 0; IE ALWAYS leaves space for the descending portions of letters - even if you have NO TEXT within the box -- it "adds" space. Giving it a font-size of zero closes up the space.

Ideally, you should put this rule in separate css 'iefixes' file and use a conditional comment to call it in your html - only IE reads conditional comments.

wow ...you are good. It's all in the details (which makes css difficult for beginners).
[ "only IE reads conditional comments" - thanks again Microsoft]

I can't seem to find the "issue resolved button"

thanks, again samj

Well, CSS by itself isn't all that hard to learn. Cross-browser issues are a pain in everyone's you-know-what-- mostly thanks to ... MS-- who else?

I can't seem to find the "issue resolved button"

That's 'cause we don't have one