HTML and CSS Output Example:
<div id="float_left">
DIV1
</div>
<div id="without_overflow">
DIV2
</div>
CSS Styling:
#float_left{
float: left;
width:200px;
background-color: red;
}
#without_overflow{
width:400px;
height:40px;
background-color:green;
}
The above code produces the expected result. However, when overflow:auto or overflow:hidden is added to the second div, the outcome is not what I anticipated.
See the unexpected result here
Can you provide an explanation for this behavior?
Thank you