- This topic is empty.
Viewing 9 posts - 1 through 9 (of 9 total)
Viewing 9 posts - 1 through 9 (of 9 total)
- The forum ‘CSS’ is closed to new topics and replies.
The forums ran from 2008-2020 and are now closed and viewable here as an archive.
I want to make specific columns invisible.
http://codepen.io/anon/pen/Gtjue
This “should” work but in reality the only browser where it does is IE8. In Firefox the borders are still displayed and in Chrome the above CSS settings have no visible effect.
Is there any better way to do it instead of applying styles to each TD separately like this?
You can use `nth-of-type()` pseudo element to hide second column.
td:nth-of-type(2) {
display: none;
}
td:first-of-type + td {
display:none;
}
Based on a 6 columns table, if you want to hide ONLY the third, you could do:
td + td + td { display: none; }
td + td + td + td { display: block; }
>but I’d really like to avoid it since it’s a huge table with almost 2500 TDs.
Wouldn’t that be basically useless from a readabilty standpoint?
Pre-filtering of results before displaying the table would seem to best best option.
Of course, I have no idea how to do that. :)
How are you going to enable columns on request?
Sounds to me like you need JS.
Checkbox hack. Pretty dirty. Do you have a reason you don’t want to use JS?
I highly recommand [this](http://filamentgroup.com/lab/responsive_design_approach_for_complex_multicolumn_data_tables/). Definitely what you’re looking for.
> This way everything should look the same even in IE5.
I see no good reason for this.