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: , ,

7 Comments:

Anonymous Anonymous said...

Yes, This really worked.
Satalaj.

July 26, 2011 at 5:20:00 AM PDT  
Blogger Zelna Smith said...

thanks for this informative blog. I m going to visit your blogs regularly to know about the recent techniques and technologies in development. If you also care about look of your project you could simply use the after effects templates so as to complete it fast.

September 29, 2015 at 4:58:00 AM PDT  
Blogger Patrick Co Eban said...

Hi, Great.. Tutorial is just awesome..It is really helpful for a newbie like me.. I am a regular follower of your blog. Really very informative post you shared here. Kindly keep blogging. If anyone wants to become a Front end developer Node js Training in Chennai . learn from or Javascript Online Training from India. Nowadays JavaScript has tons of job opportunities on various vertical industry. JavaScript Training in Chennai

April 10, 2018 at 6:26:00 AM PDT  
Blogger john martin said...

Thank you for helping loved ones transition, for burying them with blessings and honor.
Regards: office.com/setup

April 18, 2019 at 11:01:00 AM PDT  
Blogger john martin said...

This has been a challenging time, and I appreciate you so much.
Regards: office.com/setup

You have no idea how much your help has meant.
Regards: mcafee.com/activate

There was nothing random about your acts of kindness. Thank you for all you have done
Regards: mcafee.com/activate

April 18, 2019 at 11:01:00 AM PDT  
Blogger john martin said...

You took common courtesy to an uncommon level. We’re so grateful for your help.
Regards: mcafee.com/activate


Thank you for always remembering to change the oil and get the car inspected.
Regards: norton.com/setup

You went above and beyond, and I am touched and grateful.
Regards: norton.com/setup

April 18, 2019 at 11:01:00 AM PDT  
Blogger abhishek said...


thanks sir for sharing me this amazing knowledgeable site
top digital marketing institute in delhi
digital marketing course in ghaziabad
led tv repairing course
The Gyansagar
digital marketing course in noida
led tv repairing course

June 26, 2019 at 5:10:00 AM PDT  

Post a Comment

Subscribe to Post Comments [Atom]

<< Home