I have a wrapper. Inside that I have two divs, both floated to the left. Under those two divs I wanna have another div but that div dosen't start under those two, instead it begins at the wrappers top, so when I put like 20px margin top on that div called "banner" (Yeah, the div id is ="banner") the margin begins at the wrapper's top. I want it to margin at the two divs. (Sorry for bad explanation, hope you understand, else ask me whats not understandable)

1 thing (and the main issue) is that the #banner needs a clear:both; to stop snagging with the two floated items.

Another issue is that the <ul> menu you have in one of the floated divs needs to contain the floated <li>. Basically just give overflow:hidden; to that <ul>. If you want to read up on more options, check here.

Thanks man, but a problem still occurs.There is a unwanted space under those two divs and the banner and when I margin the banner it dosent start underneath the divs.

RyanReese said:

2 things I need to explain.

1 thing (and the main issue) is that the #banner needs a clear:both; to stop snagging with the two floated items.

Another issue is that the <ul> menu you have in one of the floated divs needs to contain the floated <li>. Basically just give overflow:hidden; to that <ul>. If you want to read up on more options, check here.

You will find that when your two divs are contained within a parent then the margins will not collapse on block elements in the normal flow. This would hold true for just using a wrapper. That is why they are so commonly used.

Here is a quote from the W3C

W3C - An element that has had clearance applied to it never collapses its top margin with its parent block's bottom margin.

In short I believe that is saying when elements are within the same parent then collapsing margin rules go into effect.

Try wrapping a nelement around the logo div and the social div. Give that overflow:hidden; to contain the floats. The top magin will work then :).

You will find that when your two divs are contained within a parent then the margins will not collapse on block elements in the normal flow. This would hold true for just using a wrapper. That is why they are so commonly used.

Here is a quote from the W3C

In short I believe that is saying when elements are within the same parent then collapsing margin rules go into effect.

Try wrapping a nelement around the logo div and the social div. Give that overflow:hidden; to contain the floats. The top magin will work then :).