Explain the difference between visibility:hidden; and display:none.

Experience Level: Junior
Tags: HTML

Answer

Visibility hidden

  • There will be no space allocated for it between the other tags.
  • Removes the element from the normal flow of the page, allowing other elements to fill in. Means that the tag in question will not appear on the page at all.

Display:none

  • The tag is rendered, it just isn't seen on the page.
  • Leaves the element in the normal flow of the page such that is still occupies space. Means that unlike display:none, the tag is not visible, but space is allocated for it on the page.

     

Related HTML job interview questions