Tailwind CSS Visibility

Tailwind CSS Visibility

This class accepts two values in tailwind CSS. It is the alternative to the CSS visibility property. This class is used to specify whether an element is visible or not in a web document but the hidden elements take up space in the web document. Use the display property to remove or hide and delete an element from the browser.

Visibility:

  • Invisible
  • Visible

Utilities for controlling the visibility of an element.

Tailwind CSS Visibility

ClassProperties
visiblevisibility: visible;
invisiblevisibility: hidden;

invisible: This class is used to hide the element from the page but takes up space in the document

Syntax:

<element class="invisible">...</element>

Use invisible to hide an element, but still maintain its place in the DOM, affecting the layout of other elements (compare with .hidden from the display documentation).

Tailwind CSS Visibility

visible: It is the default value. The element is shown or visible normally in the web document.

Syntax:

<element class="invisible">...</element>

Use visible to make an element visible. This is mostly useful for undoing the invisible utility at different screen sizes.

Tailwind CSS Visibility

Leave a Comment

Your email address will not be published.