Vorrei un rettangolo responsive nero appeso al fondo pagina largo quanto la pagina dove al centro mettere degli altri tag. Ho provato questa soluzione e funziona in tutte le pagine tranne una molto corta in cui questo rettangolo nero non sta più attaccato al fondo pagina ma si stacca leggermente. Come posso risolvere, sono ore che provo a pacioccare ma non risolvo nulla...
che frana che sono... 
HTML5
codice HTML:
<div class="fooder">
<h3>CONTATTI</h3>
<i>SuperMarco</i><br> <i>3978462587</i><br> <i>giannino1995@tiscali.it</i><br>
<br>
</div>
</body>
</html>
CSS3
codice HTML:
body {
line-height: normal;
text-align: center;
font-family: myFirstFont;
}
.fooder {
background: black;
color: white;
bottom: 0;
height: auto;
width: 100%;
text-align: center;
padding-top: 20px;
}