Tom
Tom

Reputation: 4577

Can't set CSS width of column in fixed column table

I have two tables next to each other, one has overflow set to auto to scroll across if there are more than X columns.

I want to have the columns in this scrollable table a fixed width which I've set with CSS. When there is just a few columns, the fixed width works.

When there is more three columns and it hits the overflow, the CSS width does not work, the column is just sized based on the text.

JSFiddle single column: https://jsfiddle.net/u4onfzzs/

JSFiddle multi-column: https://jsfiddle.net/eb5ts6c6/

Here's the CSS that is being ignored on the multi-col

#content .fixedColumn td.dataCol
{
    width:150px;
    padding:6px 0px 7px 8px;
}

I'm stumped.

Upvotes: 0

Views: 1833

Answers (1)

Lansana Camara
Lansana Camara

Reputation: 9873

In your fiddle here, you set width of th in your CSS. Change width to min-width and your columns should resize accordingly.

Example fiddle.

Upvotes: 1

Related Questions