Sent by Brian Ghidinelli on 29 November 2004 18:06
I have a page with a 2-column floated layout. Inside the #main column I
have a box like so:
div.box, div.nobox {
padding: 0px 10px 0px 8px;
margin-bottom: 12px;
border: 1px solid #76C2EE;
}
Inside of the div's, I have all kinds of normal content tags - p, table,
ul, etc. In FF/Moz/Safari, this looks correct:
<div class="box">
<table class="spreadsheet">
<tr><th>header</th></tr>
<tr><td>data</td></tr>
</table>
</div>
"Correct" means that the table border, as specified by the .spreadsheet
class does not touch the border of the div.box:
#main table { padding: 0; margin: 5px 0; border-collapse: collapse; }
#main table.spreadsheet {
margin: 9px 0 10px 0;
background-color: #fff;
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
}
In IE however, the top-margin on the table is ignored (I've tried using
padding too). E.g., the table.spreadsheet butts right up against and
"touches" the border for div.box. This is only true (or at least
visibly so) for the table tag; the p and ul seem to be OK.
It doesn't seem to be a specificity issue because the other declarations
hold true for the table (borders, etc). This also doesn't appear to be a
collapsing margins issue, does anyone know why this might happen? I
searched the archives to no avail on this one...
Thanks,
Brian
______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/