Position: relative & Position:absolute

[wave00]

ragazzi scusate, io ho visto applicare un sacco di volte la proprietà position tra 2 div, soprattutto quando ho bisogna lavorare tra container e footer come in questo caso:

html,body{margin:0; padding: 0;height: 100%}
div#container{position: relative; height:100%}
div#content{padding: 0 1.5em 5em}
div#footer{position: absolute;bottom: 0;width: 100%}

praticamente facendo così abbiamo posizionato il footer sempre in fondo alla pagina,nello specifico alla fine del container.
Qualcuno potrebbe spiegarmi come funziona questo sistema? Nn riesco a capire il legame tra relative ed absolute, visto che da come ho letto absolute rende il blocco assolutamente libero dal flusso!

[fcaldera]

è difficile darti una risposta più che altro perchè non è nota a priori quale sia la struttura xhtml
esattamente cosa vuoi fare? Posizionare un footer ancorato in basso indipendentemente da quanto la finestra sia ridimensionata in altezza?

[ALFABreezE]

Originariamente inviato da wave00
[...]
Qualcuno potrebbe spiegarmi come funziona questo sistema? Nn riesco a capire il legame tra relative ed absolute, visto che da come ho letto absolute rende il blocco assolutamente libero dal flusso!

Absolute fà come dici te, ma entro certi limiti. È vero che toglie il blocco dal flusso, ma rimane soggetto al primo blocco tra quelli nei quali è incluso (o "è figlio") che ha un positioning qualsiasi dichiarato (sia esso absolute o relative).
E visto che in questo caso il blocco 'padre' è div#container che ha un position:relative, si posiziona in base alle coordinate del div#container.
SE il div#container NON avesse avuto un positioning dichiarato, allora l'absolute sarebbe andato a cercare ancora "più su" nella gerarchia fino a trovare il Body e si sarebbe posizionato secondo le coordinate del body (quindi in fondo alla pagina ma fuori dal div#container, nel tuo caso specifico).

Il Relative invece prende come coordinate di riferimento quelle del flusso, ossia della posizione nella quale si sarebbe trovato naturalmente senza alcun "positioning".

Nonsòssemmisonocapìto... ;-)

Btw:
I posizionamenti assoluti e Capire i posizionamenti relativi
qua c'è tutto quello che ti serve di sapere in merito.

cià
ale

[wave00]

Ho letto solo adesso gli articoli e devo dire che sono molto chiari e forse ho capito come funziona il tutto
L'errore tipico che facevo era pensare che dichiarando top , right.... io dichiarassi una specie di coordinate, invece mi sbagliavo

Cmq grazie mille!!!