B.121. visibility

This property lets you set whether an element is visible or not. When an element is invisible, it is not displayed at all; however, it still occupies the space on the page that it would if it were visible. To hide an element so that it does not occupy any space on the page, set the display property to none instead.

Inherited: Yes

See also: Section B.32display

B.121.1. Value

This property will accept any one of the following constant values:

• collapse: When applied to a row (tr), row group (thead, tbody, tfoot), column (col), or column group (colgroup) element, this setting causes the row(s) or column(s) to be visibly removed from the table, allowing the table to shrink accordingly. For other elements, this setting has the same effect as hidden.

• hidden: The element is not visible, but still occupies space in the document.

• visible: The element is displayed as normal.

Initial value: visible

B.121.2. Compatibility

CSS Version: 2

All CSS-compatible browsers support this property, but none yet support the collapse value.

Netscape 4 allows only the visibility property to be set on elements whose position property set to absolute or relative.

B.121.3. Example

This style rule hides elements with class active. Using dynamic HTML, these elements could be shown in response to some user event.

.active {
  visibility: hidden;
}