div 2 pixels wider than a table?

[Sypher_5]

table {
color:#fb0;
background:#000;
border:1px solid #fb0;
width:99%;
padding:0px;
}
div {
color:#fff;
background-color:#000;
border:1px #fb0 solid;
width:99%;
padding:0px;
}
<table><tr><td>table</td></tr></table>
<div>div</div>

Why is the table wider than the div? How do I fix it? I'm trying to remove as many tables as possible & need the first to be a table to display info in a certain way, something I haven't managed with DIV's.

[birdbrain]

Hi there Sypher_5,

This seems to be a cross browser problem.

IE 6.0 renders the the div and the table with exactly the same width,
whereas Netscape 7.1 renders the table with the border inclusive and the div exclusive of the width.

birdbrain

[Sypher_5]

I've only tested this on IE6 and Opera and I'm getting this problem in both browsers.

The DOCTYPE is XHTML 1.0 Transitional which messes up all my original CSS.

[tedster]

How about rules for the table cell? If those were left to default, I think that combined with cell content, that can be the source of extra width.

[Sypher_5]

Aparently not.

I'm just going to have to make the div a table.

*grumble grumble*

Thanks for the help.