Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to Auto resize HTML table cell to fit the text size

Tags:

html

css

I have a table with 2 rows and variable columns. I tried width = 100% for the column. So the first content in the view will fit. But suppose if i am changing the contents dynamically then it is not dynamically increase/decrease the HTML table column size. Thanks in advance.

like image 490
Sonu Avatar asked Mar 03 '11 11:03

Sonu


People also ask

How do I resize a table cell in HTML?

To set the cell width and height, use the CSS style. The height and width attribute of the <td> cell isn't supported in HTML5. Use the CSS property width and height to set the width and height of the cell respectively. Just keep in mind, the usage of style attribute overrides any style set globally.

How do I make a table fit the contents of a cell?

In "Table Tools" click the [Layout] tab > locate the "Cell Size" group and choose from of the following options: To fit the columns to the text (or page margins if cells are empty), click [AutoFit] > select "AutoFit Contents." To fit the table to the text, click [AutoFit] > select "AutoFit Window."


1 Answers

If you want the cells to resize depending on the content, then you must not specify a width to the table, the rows, or the cells.

If you don't want word wrap, assign the CSS style white-space: nowrap to the cells.

like image 81
Aaron Digulla Avatar answered Sep 18 '22 14:09

Aaron Digulla