Footer margin-top

Hey,

Ik ben bezig met een nieuwe layout, alleen bij elke layout loop ik tegen één probleem aan. De footer.
Nog altijd ben ik er nog niet helemaal uit hoe ik het nou precies moet aanpakken zoiets.

Ik heb dus nu dit:
Alleen ik wil tussen de groene content en blauwe content 10 pixels hebben, normaal dus met Margin-top: 10px;
Helaas werkt dit niet.

Hier mijn CSS code:

.content{
    /* EMPTY */
}

.content .left{
    width: 550px;
    float: left;
}

.content .right{
    margin-left: 10px;
    width: 240px;
    float: left;
}


.content .left .box{
    margin-top: 10px;
    background-color: blue;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 10px;
}

.content .right .box{
    margin-top: 10px;
    background-color: blue;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    padding: 10px;
}

.footer{
    clear: both;
    margin-top: 10px;
    width: 800px;
    height: 20px;
    background-color: green;
}

En html

<div class="content">
            <div class="left">
                <div class="box">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque egestas venenatis neque. In hac habitasse platea dictumst. Sed et felis non metus hendrerit rutrum. Donec nisl lacus, placerat vitae vulputate a, laoreet non purus. Praesent accumsan dapibus enim iaculis vestibulum. Sed aliquet neque vel enim aliquam lacinia. Praesent imperdiet orci at quam ullamcorper eu vestibulum metus luctus. Phasellus sed turpis magna, at tincidunt orci. Nulla pellentesque velit non diam tincidunt volutpat molestie ipsum pharetra. Nullam semper nisi sed magna porttitor blandit.
                    
                    Suspendisse ultrices dictum adipiscing. Donec hendrerit vehicula rutrum. Duis rhoncus nibh at lectus interdum facilisis. Donec elementum, dolor id aliquet fringilla, nisi neque ullamcorper enim, ut rutrum ipsum tortor vitae lacus. Quisque sollicitudin, mi sit amet aliquam ultrices, eros justo imperdiet felis, non ullamcorper risus leo id arcu. Suspendisse potenti. In hac habitasse platea dictumst. Cras facilisis mi quis lacus sollicitudin eleifend. Ut ac massa id elit fringilla adipiscing sit amet ac augue. Maecenas mattis volutpat neque non tempor. Etiam a nisl non nulla pellentesque iaculis at id est. Mauris gravida ultricies libero ac auctor. Aenean eu tortor odio, id tempus dui. Nunc lacinia eros ut sapien lobortis commodo. Suspendisse potenti.
                </div>
                <div class="box">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque egestas venenatis neque. In hac habitasse platea dictumst. Sed et felis non metus hendrerit rutrum. Donec nisl lacus, placerat vitae vulputate a, laoreet non purus. Praesent accumsan dapibus enim iaculis vestibulum. Sed aliquet neque vel enim aliquam lacinia. Praesent imperdiet orci at quam ullamcorper eu vestibulum metus luctus. Phasellus sed turpis magna, at tincidunt orci. Nulla pellentesque velit non diam tincidunt volutpat molestie ipsum pharetra. Nullam semper nisi sed magna porttitor blandit.
                    
                    Suspendisse ultrices dictum adipiscing. Donec hendrerit vehicula rutrum. Duis rhoncus nibh at lectus interdum facilisis. Donec elementum, dolor id aliquet fringilla, nisi neque ullamcorper enim, ut rutrum ipsum tortor vitae lacus. Quisque sollicitudin, mi sit amet aliquam ultrices, eros justo imperdiet felis, non ullamcorper risus leo id arcu. Suspendisse potenti. In hac habitasse platea dictumst. Cras facilisis mi quis lacus sollicitudin eleifend. Ut ac massa id elit fringilla adipiscing sit amet ac augue. Maecenas mattis volutpat neque non tempor. Etiam a nisl non nulla pellentesque iaculis at id est. Mauris gravida ultricies libero ac auctor. Aenean eu tortor odio, id tempus dui. Nunc lacinia eros ut sapien lobortis commodo. Suspendisse potenti.
                </div>
            </div>
            <div class="right">
                <div class="box">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque egestas venenatis neque. In hac habitasse platea dictumst. Sed et felis non metus hendrerit rutrum. Donec nisl lacus, placerat vitae vulputate a, laoreet non purus. Praesent accumsan dapibus enim iaculis vestibulum. Sed aliquet neque vel enim aliquam lacinia. Praesent imperdiet orci at quam ullamcorper eu vestibulum metus luctus. Phasellus sed turpis magna, at tincidunt orci. Nulla pellentesque velit non diam tincidunt volutpat molestie ipsum pharetra. Nullam semper nisi sed magna porttitor blandit.
                </div>
                <div class="box">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque egestas venenatis neque. In hac habitasse platea dictumst. Sed et felis non metus hendrerit rutrum. Donec nisl lacus, placerat vitae vulputate a, laoreet non purus. Praesent accumsan dapibus enim iaculis vestibulum. Sed aliquet neque vel enim aliquam lacinia. Praesent imperdiet orci at quam ullamcorper eu vestibulum metus luctus. Phasellus sed turpis magna, at tincidunt orci. Nulla pellentesque velit non diam tincidunt volutpat molestie ipsum pharetra. Nullam semper nisi sed magna porttitor blandit.
                </div>
            </div>
        </div>
        
        <div class="footer">
            Rwar.
        </div>

En ik wil geen hoogtes meegeven omdat als ik dan er een login systeem of iets inmaak, dan failt dat. (ervaring )

Alvast bedankt!
Wouter(r)

Die links en rechts allebij in een div zetten en daarbij margin-bottom

Bij mij werkt je plaatje niet.

@Ewan dankje! ik al het even proberen.

@Nielsjojo probeer is http://screenshot.wouter0100.nl/ te laden?

Waarom gebruik je eigenlijk classen waar je ids moet gebruiken?

Omdat ik met classes werken handig vind voor later gebruik met Javascript en IDs.

En bedankt !

Wouterr schreef:

@Ewan dankje! ik al het even proberen.

@Nielsjojo probeer is http://screenshot.wouter0100.nl/ te laden?

Ik krijg 403 Forbidden?

Klopt, er is wat vreemds met mn host aan de hand. Hij switch tussen server 1 & 2, en die screenshot staat (denk ik) op 2.