The visibility property is used in CSS and certain HTML elements. It is used to hide an element but leaves space where it would have been. It is also used to hide rows or columns of a table. It also collapses XUL elements.


  • visible - Default value, the box is visible.
  • hidden - The box is invisible (fully transparent, nothing is drawn), but still affects layout. Descendants of the element will be visible if they have visibility:visible; (this doesn't work in IE up to version 7).
  • collapse - For table rows, columns, column groups, and row groups the row(s) or column(s) are hidden and the space they would have occupied is as if display:none; were applied to the column/row of the table. However, the size of other rows and columns is still calculated as though the cells in the collapsed row(s) or column(s) are present. This was designed for fast removal of a row/column from a table without having to recalculate widths and heights for every portion of the table. For XUL elements, the computed size of the element is always zero, regardless of other styles that would normally affect the size, although margins still take effect. For other elements, collapse is treated the same as hidden.

HTML example:

<h1 style="visibility:hidden;">
1st heading content.

CSS example:

h1 {

Ad blocker interference detected!

Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.