Footer che nasconde un pezzo di pagina web

[Sheen Edios]

Sto lavorando a una pagina web per mobile, ma essendo ancora uno studente, mi sono imbattuto in un problema irritante che non riesco a risolvere. Il footer mi copre parzialmente un pezzo di pagina web, ma non riesco a sistemarlo in modo tale da averlo a fine pagina ma senza intralci. Il CSS del footer è il seguente:

#footer {background-color: #03A2B1;
          position:fixed;
          bottom:0;
          left:0;
          right: 0;
          font-family: 'Quicksand', sans-serif;
          font-size: 0.8em;
}

L'<article> contiene quattro div stilizzati, e il suo CSS (non degli elementi dentro) è il seguente:

#article {height: auto;}

Cosa sto sbagliando? Vi lascio uno screen. Grazie per l'attenzione.

Screenshot_2015-07-26-01-53-14.jpg

[carlomarangoni]

A naso in questa ora della notte direi che il problema è la posizione fissa del footer. Prova a lasciarlo semplicemente in fondo al flusso normale della pagina.

Ricorda che i posizionamenti assoluti o fissi se non hanno ragione di esistere per qualche motivo, creano molto spesso problemi

[Sheen Edios]

A naso in questa ora della notte direi che il problema è la posizione fissa del footer. Prova a lasciarlo semplicemente in fondo al flusso normale della pagina.

Ricorda che i posizionamenti assoluti o fissi se non hanno ragione di esistere per qualche motivo, creano molto spesso problemi

Il problema è che se lo lascio libero si posiziona appena finiti gli elementi dell'<article>, creando poi sotto di esso un buco...

Allegato 26156

[WottaFacca]

Dovresti aggiungere un div vuoto delle stesse dimensioni del footer, quindi larghezza: 100% e altezza: tot, così da visualizzare anche il pezzo che viene "mangiato"

[panagulis72]

Prova semplicemente a ad aggiungere in margin-bottom in percentuale all'ultimo div 'mostre' !