Jump to content


general question about clear:both

  • Please log in to reply
1 reply to this topic

#1 redbullmarky

  • Staff Alumni
  • Advanced Member
  • 2,863 posts
  • LocationBedfordshire, England

Posted 26 October 2006 - 10:47 AM

Hi all

Anyone have any idea why some browsers create a huge gap underneath floats when using either <div> or <br /> styled with clear:both, and how to avoid it? it normally happens within a DIV that has a margin of, say, 200px to allow for a left-floated menu that sits outside of it. when i remove the menu, and the margin, the problem goes away.

"you have to keep pissing in the wind to learn how to keep your shoes dry..."

I say old chap, that is rather amusing!

#2 wildteen88

  • Staff Alumni
  • Advanced Member
  • 10,482 posts
  • LocationUK, Bournemouth

Posted 26 October 2006 - 05:52 PM

If you use margin: 200px then its going to add a 200px margin on all sides and thus you get a gap when your use clear:both. Just apply the margin/padding to the side you want it on:
margin-left: 200px

Or float the left and right elements to the left then you don't need to worry about adding margins to position the element on the right. The elements will but-up-against each other.

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users