HTML and CSS Reference
In-Depth Information
#menu li ul {
position: absolute;
display: none;
left: 0;
}
[...]
#menu li:hover ul {
display: block;
}
Hiding Elements:
display
vs.
visibility
Two ways hiding content can be accomplished are via the two
properties
display:none
and
visibility:hidden
. In the case of the
visibility
property, the content continues to occupy the space in
the document flow that it would normally. For the
display
property,
since the element is no longer a
block
,
inline
, or other type, it is
removed from the document flow as if it didn't exist. Unless hold-
ing that space open for laying out other elements or maintaining its
properties such as
height
and
width
is important for other feature
of the page (like in some JavaScript interactions),
display
is typi-
cally used.