Open Bug 1079205 Opened 8 years ago Updated 2 months ago

Hiding nth-child table column, must include hiding <col>


(Core :: Layout: Tables, defect)

32 Branch





(Reporter: wowmotty, Unassigned)


(Keywords: reproducible, testcase)


(1 file)

User Agent: Mozilla/5.0 (Windows NT 6.3; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/37.0.2062.124 Safari/537.36

Steps to reproduce:

Set up a table with a &lt;col&gt; defining the width of each table column.
Use a css nth-child() selector to hide a table column.

See this demo for an example:

* Tested in Chrome, IE11 and Firefox for Windows 8.1

Actual results:

The hidden column continues to occupy space within the table

Expected results:

With a hidden column, the remaining columns should expand to fill the width of the table. The &lt;col&gt; must be hidden in order to allow the table to expand to full width.
Component: Untriaged → Layout: Tables
Product: Firefox → Core
OS: Windows 8.1 → All
Hardware: x86_64 → All
This looks like the right rendering per spec: the page is explicitly defining four columns each of 25% width, so if there is extra width it gets assigned to all four columns.  You're hiding the _cells_ in one of the columns, but not hiding any actual _columns_.  If you don't want one of the columns to exist, you should be setting display:none on the relevant <col> element.
Summary: Hiding nth-child table column, must include hiding &lt;col&gt; → Hiding nth-child table column, must include hiding <col>
Then shouldn't setting display:none on the <col> element hide the entire column, including the cells?
No.  display:none gives the same behavior, in terms of layout, that you would get if you just removed that element from the DOM.

So display:none on a <col> element acts just like removing that <col> from the DOM: the next <col> ends up mapping to the cells in the column,
You want visibility:collapse, not display:none.
Also:  how, if at all, does Gecko behavior here differ from other browsers?
Severity: normal → S3
You need to log in before you can comment on or make changes to this bug.