Menu
I've got a table with two rows. The first row just has three cells. The second row has two cells, with the first cell containing another table that needs to fill the whole cell.
<table border="1" style="border-collapse:collapse;"> <tr> <td style="WIDTH: 205px;">1</td> <!--This width doesn't apply in Chrome--> <td style="width:100%;">2</td> <td style="WIDTH: 5px;">3</td> </tr> <tr> <td colspan="2"> <TABLE width="100%" border="1" style="border-collapse:collapse;table-layout: fixed;"> <TR> <TD style="width:130px;"> A</TD> <TD style="width:90px;"> B</TD> <TD style="width:230px;"> C</TD> </TR> </TABLE> </td> <td> D </td> </tr> </table> Simple enough, really....or so I thought.
It appears as I would expect in IE. But Chrome seems to not apply the width of the first cell correctly. It seems to be affected by the table in the cell below.
Why is this happening, and how can I get around this?
818
Select your table. On the Layout tab, in the Cell Size group, click AutoFit. Click Fixed Column Width.
To set the table width in HTML, use the style attribute. The style attribute specifies an inline style for an element. The attribute is used with the HTML <table> tag, with the CSS property width.
I've got a table with two rows. The first row just has three cells. The second row has two cells, with the first cell containing another table that needs to fill the whole cell. Simple enough, really....or so I thought. It appears as I would expect in IE. But Chrome seems to not apply the width of the first cell correctly.
What does Stop Using To Set Table Width In HTML: Here's Why do? Was used to set the width of a table data cell to a value that would override the default width. This attribute has been deprecated.
Adjusting Table Column Width The width attribute, now deprecated, was once the correct way to adjust the width of a table’s columns. By default, a browser will adjust table columns to fit the contents of the table. However, if you want to control the width of each column, you can do so by adjusting the width of each <td> or <th> of a single row.
Use CSS to control layout of data cells in HTML tables. The width attribute, now deprecated, was once the correct way to adjust the width of a table's columns. By default, a browser will adjust table columns to fit the contents of the table.
Two things you should do:
table-layout: fixed; Like this:
<table border="1" style="table-layout: fixed; width: 100%;"> <colgroup> <col style="width: 205px;"> <col style="width: auto;"> <!-- Use "width: auto;" to apply the remaining (unused) space --> <col style="width: 5px"> </colgroup> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> <!-- Etc. --> If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
