Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Table with 100% width with equal size columns

Tags:

html

css

I have to dynamically create a table with a variable number of columns, determined at runtime.

Can somebody tell me if it's possible to have a html table with equal size columns that are fully stretched?

like image 321
Andrei Ciobanu Avatar asked May 27 '10 09:05

Andrei Ciobanu


People also ask

How do you make a table equal column width in HTML?

Just add style="table-layout: fixed ; width: 100%;" inside <table> tag and also if you do not specify any styles and add just style=" width: 100%;" inside <table> You will be able to resolve it.

How do you make a full width occupy table?

You need to set the margin of the body to 0 for the table to stretch the full width. Alternatively, you can set the margin of the table to a negative number as well.


1 Answers

If you don't know how many columns you are going to have, the declaration

table-layout: fixed

along with not setting any column widths, would imply that browsers divide the total width evenly - no matter what.

That can also be the problem with this approach, if you use this, you should also consider how overflow is to be handled.

like image 117
orszaczky Avatar answered Sep 21 '22 11:09

orszaczky