Footer автоматически не двигается вниз страниц

Question

я использую этот CSS для моей сноски:

/* FOOTER */ 
#footer { 
    width:100%; 
    height:580px; 
    border-top:4px solid #666666; 
    background-color:#eeeeee; 
} 
#footer-inner { 
    width:80%; 
    margin:0 auto 0 auto; 
    height:inherit; 
} 
#footerTop { 
    width:100%; 
    height:480px; 
    padding-top:10px; 
    border-bottom:2px #000000 solid; 
} 
#footerTopLeft { 
    width:30%; 
    height:420px; 
    float:left; 
    display:inline; 
    margin-top:10px; 
    padding:0 15px 10px 15px; 
    border-right:1px solid #000000; 
} 
#footerTopMid { 
    width:30%; 
    height:420px; 
    float:left; 
    display:inline; 
    margin-top:10px; 
    padding:0 15px 10px 15px; 
    border-right:1px solid #000000; 
} 
#footerTopRight { 
    width:30%; 
    height:420px; 
    float:left; 
    display:inline; 
    padding:0 15px 10px 15px; 
} 

#enquiryForm     { clear:both; padding:8px 40px 0 0; } 
.enquiryField     { clear:both; padding:5px 0; } 
.enquiryField label    { clear:none; float:left; } 
.enquiryField input    { clear:none; font-family:Calibri; float:right; padding:3px; width:189px; } 
.enquiryField textarea   { clear:none; float:right; font-family:Calibri; padding:5px; width:189px; } 

.enquiryError     { clear:both; color:#fff; font-family:Calibri; } 
#enquirySent     { color:#fff; font-family:Calibri; } 

но не двигаются вниз страниц автоматически в зависимости от того, насколько содержания выше него. здесь скрипка с полным CSS/HTML:

http://jsfiddle.net/ctmGT/

я, кажется, чтобы изменить высоту DIV, что я в зависимости от количества содержания я имею

Answer 1

вам нужно изменить

<div style="clear: both; height:500px;"></div> 

в

<div class="push"></div>