ansaurus

Question

How to define cell width for 2 HTML tables with different column counts?

Answer 1

A:

.table1 td {width:33%} .table2 td {width:25%}

Superstringcheese 2010-05-18 20:56:38

Answer 2

A:

Using some CSS:

#Table1 td{
    width: 33%;
}
#Table2 td{
    width: 25%;
}

jeanreis 2010-05-18 20:56:49

Answer 3

A:

This CSS should work

table td{
width:100%;
}

table{
table-layout:fixed;
}

Kasturi 2010-05-18 20:57:59

Answer 4

A:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
<html xmlns="http://www.w3.org/1999/xhtml" >

    <style type="text/css">
        table 
        {
            table-layout: fixed;
            width: 100%;
        }
    </style>

uhleeka 2010-05-18 21:02:54

Answer 5

+4 A:

The answers so far have got close, but none quite right:

#Table1, #Table2 {
    width: 100%;
    table-layout: fixed;
}

and that's all.

table-layout: fixed is to be preferred for all tables where column widths shouldn't depend on cell contents. This is faster and much more reliable than the default auto table layout algorithm.

Because none of the columns have an explicit width here (either from a <col> element or from the first row of <td>s, they all share the remaining 100% of available width equally between them, however many there are. So you don't have to calculate 25%s or 33%s.

bobince 2010-05-18 21:15:59

ansaurus

tags:

views:

answers:

How to define cell width for 2 HTML tables with different column counts?

related questions