Allineamento sul fondo di un Footer

[MM88]

Ciao, ho un div che funge da footer presente all'interno di un altro div (wrapper) che chiude la mia pagina html.

In che modo posso modificare i parametri del css in modo che il footer si sposti alla base del wrapper?

Indipendentemente dall'altezza del finestra del browser vorrei che il footer si colocasse sempre alla fine in basso, perché in questo momento vedo lo sfondo del wrapper.

Ho provato con vertical-align:bottom;, ma non cambia.


grazie

[ricman]

...se ci fai vedere qualcosa è meglio.. un link andrebbe benissimo

[MM88]

ecco il codice.



HTML:

<div id="wrapper1">
	
	<div id="wrapper2">
	
	<div id="main">

        

        </div>

		<div id="footer">
			

		</div>
	
	</div>

</div>

CSS:

#wrapper1 {
	position:relative;
	text-align:left;
	width:100%;
	}

#wrapper2 {
	position:relative;
	text-align:left;
	width:100%;
	
	}


#main {
	position:relative;
	margin:0;
	padding:0px;
	height: 100%;
	}


#footer {
	position:relative;
	top:0px;
	clear:both;
	margin:0;
	padding: 0px 10px;
	text-align:left;
	vertical-align:bottom;
	}

Come faccio a mettere il footer sempre in fondo alla pagina?


grazie

[custanz]

nella definizione dell'id del footer, perchè non provi a mettere

bottom: 0px;

al posto di:

top: 0px;

[gengix]

http://css.html.it/guide/lezione/64/...ma-del-footer/

[MM88]

Grazie, ma per farlo funzionare, ho dovuto togliere il footer e lasciarlo come ultimo div.

All'interno dei wrapper non arriva sul fondo.

[ricman]

Originariamente inviato da MM88
ho dovuto togliere il footer e lasciarlo come ultimo div.

...in generale cmq non usare le position i top ... Il tuo footer potrebbe essere benissimo così:___

#footer {
	clear:both;
	margin:0;
	padding: 0px 10px;
	text-align:left;
	}

E stare tranquillamente, grazie al Clear, sotto alle colonne e dentro un div principale...__

<div main...>
  <div header...>
  <div sx...>
  <div centro...>
  <div dx...>
  <div footer...>
</div main>

[gengix]

Non vedo il problema di una modifica di questo tipo, a meno che tu non lavori con le master page

[gengix]

Non ho capito una cosa:
Il footer lo vuoi sempre posizionato in basso alla finestra?
O come suggerito da ricman, vuoi che stia sempre in fondo al contenitore che hai definito?

e cmq puoi levare i vari position che hai dichiarato, perchè in questo contesto non ti servono a niente, scrivi solo codice in più.

[MM88]

Il footer si trovava dentro due wrapper e volevo che stesse sempre in fondo ad essi.


Ho dato anche ai wrapper - come al body - altezza 100% , e ora il bottom:0; del footer funziona.



grazie