← All tutorials

GoCareerGo Tutorials

CSS Tutorial

Selectors, box model, Flexbox, Grid, animation and responsive design.

display: none vs visibility: hidden vs opacity: 0

Three ways to hide an element compared.

Quick-reference summary — a full handcrafted walkthrough is coming soon for this topic.

Three ways to hide an element compared.

  • Category: CSS Questions — part of the CSS Tutorial on GoCareerGo
  • Read the short summary above, then check the linked docs for full syntax/behaviour
  • Interview tip: be ready to explain "display: none vs visibility: hidden vs opacity: 0" in one sentence, then back it up with a tiny example
/* display: none vs visibility: hidden vs opacity: 0 */
.example {
  /* see the property reference on MDN for full syntax */
}
Tip

Quick recall: "display: none vs visibility: hidden vs opacity: 0" — three ways to hide an element compared.