When I use the default overflow
value, an <ul>
element disappears. Here's a snipped I've tested with Google Chrome:
ul {
list-style-type: none;
background-color: #333333;
}
li {
float: left;
color: white;
}
<ul>
<li>Test</li>
</ul>
However, when I add overflow: hidden;
to <ul>
, it becomes visible:
ul {
list-style-type: none;
background-color: #333333;
overflow: hidden;
}
li {
float: left;
color: white;
}
<ul>
<li>Test</li>
</ul>
As far as I know, the overflow
property specifies if the overflow renders outside the element's box. Why the whole element is invisible when the default overflow: visible
is set?