Geek Answers Handbook

The first column in the HTML table is flexible if the width of the table = 100%

I have an HTML table with 8 columns and several rows. The contents of each cell are dynamically generated, and it is difficult to predict the width of any column. I set the table width = 100%, since I would like the table to occupy the entire width of the div. I would like columns 2 through 8 to remain the same as width, as if I were not setting the width of the table. Then I would like the first column to expand its width so that the width of the table becomes 100%. Is it possible?

+5
source share
4 answers

Set the width of the table and all other columns; the remaining column will occupy the entire slack.

, table-layout: fixed, ( IE, , ) , .

<col> ; . ; , .

<table>
    <col class="name" /><col class="data" /><col class="data" /><col class="data" />
    <col class="data" /><col class="data" /><col class="data" /><col class="data" />
    <tr>
        <td>tiddle om pom pom</td>
        <td>1</td><td>2</td><td>3</td><td>4</td><td>5</td><td>6</td><td>7</td>
    </tr>
</table>

table { width: 100%; table-layout: fixed; }
col.data { width: 2em; }
+5
<div>
<table width="100%">
<tr>
<td width="100%"></td>  <- this is col 1
<td></td><td></td><td></td><td></td><td></td><td></td><td></td> <- cols 2-8
</tr>
</table>
</div>

100%, , . 2-8 , , - , 100% .

+3

2 - 8, 1 . no-wrap , , , .

+2

, , , , . , , - .

, ?

0

More articles:


All Articles