m007co
m007co

Reputation: 35

margin-top and margin-bottom inside floated div not working

I have a problem with margin-top and margin-bottom for some elements inside a floated div.

It's a column div floated to the right (I have also 2 other column divs floated to the left)

Demo here: http://jsfiddle.net/zTb3g/

I need the "float" to adjust columns in the page, but the margin-top and margin-bottom don't work in some of the elements (ex: b, label, a), yet it works normally for other elements (ex: p, input).

I tried a lot of clearing styles in different places of the markup. Hope someone can help.

Thanks

Upvotes: 1

Views: 2569

Answers (2)

Afshin
Afshin

Reputation: 4215

See this i think this is what you want http://jsfiddle.net/afshinprofe/zTb3g/1/

Upvotes: 0

Mr. 14
Mr. 14

Reputation: 9528

You have to set display:block for the elements. Aside from that, when you have two elements placed one after the other, their margins will overlap. You might consider setting their paddings instead.

Upvotes: 1

Related Questions