How to hide columns in HTML table? How to hide columns in HTML table? asp.net asp.net

How to hide columns in HTML table?


You need to use Style Sheet for this purpose.

<td style="display:none;">


You can use the nth-child CSS selector to hide a whole column:

#myTable tr > *:nth-child(2) {    display: none;}

This works under assumption that a cell of column N (be it a th or td) is always the Nth child element of its row.

Here's a demo.


​If you want the column number to be dynamic, you could do that using querySelectorAll or any framework presenting similar functionality, like jQuery here:

$('#myTable tr > *:nth-child(2)').hide();

Demo with jQuery

(The jQuery solution also works on legacy browsers that don't support nth-child).


you can also use:

<td style="visibility:hidden;">or<td style="visibility:collapse;">

The difference between them that "hidden" hides the cell but it holds the space but with "collapse" the space is not held like display:none. This is significant when hidding a whole column or row.