469,323 Members | 1,665 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,323 developers. It's quick & easy.

how to make a TD take up remaining width?

Hi,

I'm trying to use css to set the widths of cells and tables, for
multiple tables.

The width of the tables is 450px, set in stylesheet.

The number of columns and widths vary, but I'd like one column to
stretch and take up any remaining space.

I've set the width of the table to 450px in my stylesheet. And TD's all
have classes that set their width to a certain amount of pixels in an
external stylesheet, except for the one column that needs to stretch.
If I set that one column to width="100%" the table exceeds 450px and
breaks my layout.

This is what is would look like, for example:

<table class="master">
<tr>
<td class="date"></td>
<td class="type"></td>
<td class="total"></td>
</tr>
</table>

<table class="master">
<tr>
<td class="num"></td>
<td class="date"></td>
<td class="location"></td>
<td class="type"></td>
</tr>
</table>

stylesheet:

table.master {width:450px}
table.master td.num {width:45px}
table.master td.location {width:90px}
table.master td.total {width:135px}
table.master td.type {width:60px}
table.master td.num {width:100%}

Nov 23 '05 #1
0 1446

This discussion thread is closed

Replies have been disabled for this discussion.

By using this site, you agree to our Privacy Policy and Terms of Use.