Tutorials All - Webdesign, Graphic Design

Visit our new Webdesign Templates,css,html5 etc

Download New Android Applications

Visit our new Collections of Android Application

28.2.11

Float bug fix in div to expand

Many of would find a problem when using a block(div) called a container with the background color, where you don't want to use float or height to the div. And in the inner div of the container you want to give float to it.

You can find this issue in most of the browser like iefirefox, the container will not expland as the inner div.


For Example:
HTML:
<div class="container">
<div class="inner_div">
blablabla <br> blablabla <br> blablabla<br>
</div>
</div>

CSS:
.container{width:300px;background:red;}
.inner_div{float:left;width:200px;font:12px arial;}

The red background in the container div will not expand when you add content to the inner div. So here is a simple trick to get the container div to expand.

Just add
.container{overflow:hidden;}

0 comments:

Post a Comment