Table column width as needed (HTML/CSS)

Question

When tables are rendered the table usually only takes up 100% of the screen (if it is big enough) and then the columns get as little space each as is possible. Typically the columns will get as much space as the longest non-breakable content requires. How can I make things so that each column will get as much space as its longest content, even if that means the table will have to take up more than 100% of the screen width? I want each column to be as long as its longest content, regardless of how much space the table will have to consume.

Patrick Allen · Accepted Answer · 2014-03-30 07:02:01Z

4

Try this:

td {
    white-space: nowrap;
}

This makes it so the text in each table data cell will not wrap.

Proof it works: Here.

edited Mar 30, 2014 at 7:02

answered Mar 30, 2014 at 6:56

Patrick Allen

2,1882 gold badges17 silver badges20 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Table column width as needed (HTML/CSS)

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related