CSS GUIDE VISIBILITY

From CDOT Wiki
Jump to: navigation, search

This document is a work in progress and is subject to change.

Summary

The visibility property specifies whether the boxes generated by an element are rendered, hidden, or collapsed. Except for one exception (described below), the layout of the page is still affected by invisible boxes.

Applicability:The visiblity property can be used for all CSS elements.
Media Group: Visual
Inherited:Yes

Syntax

TARGET_ELEMENT{ visibility: visible|hidden|collapse }

Legal Values

The legal values of the visiblity property are:

  • visible: The box generated by the element is visible.
  • hidden: The box generated by the element is invisible however the layout of the page is still affected.
  • collapse: For the row, row group, column, and column group elements, this value causes the entire row or column to be removed from the display. Unlike the hidden value, it does not affect the layout as other content can be placed where the row or column data would normally be. If used on any other element, the collapse value has the same meaning as the hidden value.

Mozilla Recommended Values

Usage Examples

/* Set the visibility to visible */
p { visibility: visible }
/* Set the visibility to hidden */ 
p { visibility: hidden }
/* Set the visibility to collapse */
p { visibility: collapse }

Notes

Even though an element's visibility is hidden and not drawn on the screen, the layout is still affected. If an element's visiblity is hidden, the descendents of the element will be visible if they have their visibility set to visible.

For the row, row group, column, and column group elements, the collapse value causes the entire row or column to be removed from the display. Unlike the hidden value, it does not affect the layout as other content can be placed where the row or column data would normally be. If the collapse value is used on any other element, the collapse value has the same meaning as the hidden value.

Specification Conformance

Browser Compatibility

See Also