Contact Us

|

FriendFeed FriendFeed

|

follow us on twitter Twitter

|

 Rss Feed

|

Favorites Add to Favorites

Wednesday, July 22, 2009

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 ie, firefox, 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;}

Will make the job easy.

Labels: , ,

1 Comments:

Anonymous Anonymous said...

Yes, This really worked.
Satalaj.

July 26, 2011 at 5:20:00 AM PDT  

Post a Comment

Subscribe to Post Comments [Atom]

<< Home