visibility

Shows or hides an element without affecting the document layout. Unlike display: none, a hidden element still takes up space.

Quick example

.invistible-box {
  visibility: hidden;
  /* element disappears but its space remains occupied */
}

Quick facts

Initial value
visible
Inherited
Yes
Applies to
all elements
Animation type
discrete

Values

visiblehiddencollapse

visibility Browser Support

Widely available Since 2015 96% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2015.

Safe to use without fallbacks.

1+
1+
1+
12+
ESC