Because when you apply 'clear' to an element, it essentially breaks free of
the floated layout. Thus the margin of 2% takes up some of the space it has
to clear (within the space occupied by the cleared elements). Only once the
margin exceeds the space occupied by previously floated elements does it
start to take effect.

Remove `clear: both` from the footer or `float: left` from the section and
the problem is resolved.

Regards,
Barney Carroll

[email protected]
+44 7429 177278

barneycarroll.com


On 20 September 2013 15:16, John <[email protected]> wrote:

> On the page below, declaring:
>
> margin: 2% 0 0 0; produces no result. In fact, only throwing in ridiculous
> figures, such as 50em produce any change at all. Yet declaring a margin
> below on the Section above it produces results at 2%, 1%.
>
> What is preventing margin-top values from working for footer, while
> margin-bottom on the section works?
>
> Here are section and footer (footer with no margin value):
>
> John
>
> http://coffeeonmars.com/new/
>
> footer{
>     background-color:purple;
>     width:100%;
>     height:200px;
>     max-width:960px;
>     clear:both;
> }
>
> section{
>     background-color:silver;
>     margin:2% 0 2% 0;
>     width:100%;
>     float:left;
> }
> ______________________________**______________________________**__________
> css-discuss [[email protected]]
> http://www.css-discuss.org/**mailman/listinfo/css-d<http://www.css-discuss.org/mailman/listinfo/css-d>
> List wiki/FAQ -- 
> http://css-discuss.incutio.**com/<http://css-discuss.incutio.com/>
> List policies -- 
> http://css-discuss.org/**policies.html<http://css-discuss.org/policies.html>
> Supported by evolt.org -- 
> http://www.evolt.org/help_**support_evolt/<http://www.evolt.org/help_support_evolt/>
>
______________________________________________________________________
css-discuss [[email protected]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to