Hi y'all,
I've come across a most vexing problem I hope y'all have seen before.
I've got a div wrapped around a table. I'd like the table to run up
the borders of the div so it looks like there's a border on the
table, but I'll be adding more content inside this border so I'd
rather place the border on the parent div.
The div has padding applied for anything else that isn't a table. To
get the table to stretch out to fill the entire div I tried negative
margins. The table won't expand completely once there is any padding
on the parent div. Negative margins or no. It would be nice to use
child selectors but I have to support IE. I can't add margins to
every child to fake the padding or I risk making the CSS more
complicated than necessary.
Anybody have any ideas? or can you explain why the table won't expand
to 100%?
thanks,
ant
here's the code I'm using:
.rbox {
margin-bottom: 36px;
border: 1px solid #b3b3b3;
padding:8px 8px 12px 12px;
}
.rbox table {
border: 0;
border-collapse: collapse;
clear: both;
margin:0 -8px 0 -12px;
padding:0;
position: relative;
width: 100%;
}
.rbox table tr {
border-bottom: 1px solid #d5d5d5;
}
.rbox td, .rbox th {
padding:7px 6px 6px 12px;
text-align: left;
}
.altrow {background-color:#eee;}
<table>
<tr>
<th>colhead</th>
<td>datum</td>
</tr>
<tr class="altrow">
<th>colhead</th>
<td>datum</td>
</tr>
</table>
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
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/