clear: both

[brown2005]

on another topic someone has said

 

"you never cleared the floats. Use <div class="clear"></div> .class { clear: both; } or the "new modern day clearing methods."

 

what are the modern day clearing methods???

 

and when should i use the .clear on all divs? or a certain div?

[TheFilmGod]

That was me who said that... I would appreciate some credit! 

 

http://www.positioniseverything.net/easyclearing.html

 

Everything is explained there!

[haku]

Nice link Film God!

[brown2005]

yes i remember thanks TheFilmGod !!!!!

[bronzemonkey]

That was me who said that... I would appreciate some credit! 

 

http://www.positioniseverything.net/easyclearing.html

 

Everything is explained there!

 

Like I said when you asked about this FilmGod, that method is somewhat "outdated" because it still involves editing the html to clear. You can see my method, an adaptation of the concepts in that article but using only css, here:

 

http://www.phpfreaks.com/forums/index.php/topic,184490.0.html

[TheFilmGod]

That was me who said that... I would appreciate some credit! 

 

http://www.positioniseverything.net/easyclearing.html

 

Everything is explained there!

 

Like I said when you asked about this FilmGod, that method is somewhat "outdated" because it still involves editing the html to clear. You can see my method, an adaptation of the concepts in that article but using only css, here:

 

http://www.phpfreaks.com/forums/index.php/topic,184490.0.html

 

Sorry - but maybe I didn't get something. The link I originally provided does not involve editing the html. It's all in the css.

[bronzemonkey]

No, it's not  . You need to put a class of "clearfix" on any element you wish to self-clear. It's better than using an empty div but you can clear without even needing to add a class to the element.

[tomfmason]

You don't have to have clear:both you can do something like

 

.container{
  width:100%;
  display:block;
  overflow:hidden;
}

.left{
  width:30%;
  float:left;
  display:block;
}

.right{
  width:69%;
  float:right;
  display:block;
}

 

<div class="container">
  <div class="left"></div>
  <div class="right"></div>
</div>