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/

Reply via email to