Twitter-Bootstrap: il contenuto si sovrappone a sticky-footer

Question

Il mio contenuto si sovrappone al mio footer (che è appiccicoso). Ma dovrebbe avere una normale imbottitura. Come uso CakePHP (non rilevante) e Twitter Bootstrap. Su alcune pagine funziona, e su altro no. Come posso risolvere questo?

CSS

body { 
    padding-top: 60px; 
} 
.sidebar-nav { 
    padding: 9px 0; 
} 

html, body { 
    height: 100%; 
} 
footer { 
    padding: 17px 0 18px 0; 
    border-top: 1px solid #000; 
} 
.wrapper { 
    min-height: 100%; 
    height: auto !important; 
    height: 100%; 
    margin: 0 auto -63px; 
} 
.push { 
    height: 63px; 
} 

HTML

<div class="container-fluid wrapper"> 
    <div class="row-fluid"> 
     <div class="span11"> 
      //content 
     </div> 
    </div> 
</div> 

<footer class="footer">   
    <div class="container-fluid"> 
     <div class="row-fluid"> 
      <div class="span8"> 
      </div> 
      <div class="span4"> 
       <div class="footer-links pull-right> 
        //content 
       </div> 
      </div> 
     </div> 
    </div> 
    <div class="footer-floor"> 
     <div class="container-fluid"> 
       //content 
     </div> 
    </div> 
</footer> 

Answer 1

Affinché il piè di pagina appiccicoso al lavoro, è necessario impostare altezze sia per .push e .footer. Prova ad aggiungere l'altezza 63px anche al piè di pagina.

.push, footer { 
height: 63px; 
} 

Answer 2

Rendi il tuo footer in qualche modo z-index sulla barra laterale z-index.