It's simple, just set the display
property to none
in CSS:
#tinynav1
{
display:none
}
again when you would like to show it set the display
to block
.
visibility: hidden
hides the element, but it still takes up space in the layout.
display: none
removes the element completely from the document. It does not take up any space, even though the HTML for it is still in the source code.
Other advantages of using display
:
display:none
means that the element in question will not appear on the page at all (although you can still interact with it through the DOM). There will be no space allocated for it between the other elements.
visibility:hidden
means that unlike display:none
, the element is not visible, but space is allocated for it on the page.