css - Floating elements within a div, floats outside of div. Why? -
say have div, color green , give definite width, when put stuff within it, in case img , div. idea content of container div cause container div stretch out, , background contents. when this, containing div shrinks fit non-floating objects, , floating objects either way out, or half out, half in, , not have bearing on size of big div.
why this? there i'm missing, , how can floated items stretch out height of containing div?
the easiest put overflow:hidden
on parent div , don't specify height:
#parent { overflow: hidden }
another way float parent div:
#parent { float: left; width: 100% }
another way uses clear element:
<div class="parent"> <img class="floated_child" src="..." /> <span class="clear"></span> </div>
css
span.clear { clear: left; display: block; }
Comments
Post a Comment