Posizionamenti alternativi livelli

[Ale85mk]

Salve a tutti,

ho un layout di questo tipo (vedere allegato)...mi servirebbe sapere qual'è la giusta sintassi CSS per visualizzare nel codice i div in questo ordine:

<div id="container">

<div id="centrale">centrale</div>
<div id="destra">destra</div>
<div id="sinistra">sinistra</div>
<div id="footer">footer </div>
<div id="header">header</div>

</div>

E' da sapere che l'altezza del div container è variabile...quindi non devo applicare dimensioni fisse.
Ho provato con i posizionamenti assoluti, ma il risultato non è quello desiderato.
Comunque vi posto anche il mio css:


div#container{
margin:0px auto;
width:960px;
position:relative;
background:#0f0;
overflow:hidden;
}

div#header{
background:#06f;
overflow:hidden;
margin:0 auto;
height:250px;
}

div#sinistra{
position: absolute;
top: 250px;
left: 0;
width: 225px;
background:#ddd;
overflow:hidden
}

div#destra{
position: absolute;
top: 250px;
right: 0;
width: 255px;
background:#aaa;
overflow:hidden
}

div#centrale{
position: absolute;
top: 250px;
left:225px;
width:480px;
overflow:hidden;
background:#0f0
}

div#footer{
width:960px;
background:#ff0;
overflow:hidden;
}

Mi potere aiutare per favore???

Vi ringrazio in anticipo.

[Ale85mk]

Scusate ... ho dimenticato l'anteprima ...eccola



Mi sapreste aiutare?!?!

[Myaku]

puoi usare i float.
http://css.html.it/guide/lezione/39/...y-float-clear/

forse anche questo link può esserti utile

[Ale85mk]

Ciao,

inizio col ringraziarti per avermi risposto.

Comunque il problema rimane, nel senso che se avessi bisogno di una visualizzazione classica, non ci sarebbero problemi, purtroppo però, ho bisogno che l'html visualizzi i DIV in posizioni diverse rispetto a quelle che appaiono graficamente.
Cerco di spiegarmi meglio:

IMPOSTAZIONE CLASSICA:

<div id="container">

<div id="header">header</div>
<div id="sinistra">sinistra</div>
<div id="centrale">centrale</div>
<div id="destra">destra</div>
<div id="footer">footer </div>

</div>

IMPOSTAZIONE DI CUI NECESSITO:

<div id="container">

<div id="centrale">centrale</div>
<div id="destra">destra</div>
<div id="sinistra">sinistra</div>
<div id="footer">footer </div>
<div id="header">header</div>

</div>

In pratica il risultato grafico deve essere identico...deve cambiare solo l'HTML.
Se si può fare con i float, potresti gentilmente farmi un esempio?
Grazie Mille.
Saluti

[Myaku]

Originariamente inviato da Ale85mk
In pratica il risultato grafico deve essere identico...deve cambiare solo l'HTML.
Se si può fare con i float, potresti gentilmente farmi un esempio?
Grazie Mille.
Saluti

usando opportunamente i float, dovresti riuscire. Devi giusto fare un po' di prove. Te la butto lì, inizia provando a fluttuare sinistra a left e destra a right, con clear sul footer. Però ripeto, è da provare, non è detto sia la soluzione giusta.