Layout a tre colonne "dinamiche"

martedì 19 agosto 2008 - 11.39

Elenco Threads

Stanze Forum

Aggiungi ai Preferiti

Cerca nel forum

paquito_ita Profilo | Senior Member

224 messaggi | Data Invio: mar 19 ago 2008 - 11:39

Ciao,

devo realizzare un semplice layout a tre colonne usando div. Unica peculiarità è fornire la possibilità di "nascondere" una colonna settando (runtime) la relativa width:0px; (o in un altro modo se me lo suggerite).

Questo perché devo creare dei "template" per le pagine di un portale ed ogni div verrà usato come contenitore. In taluni casi solo due colonne (anzichè tre) servono, per cui la necessità è quella di potere "nascondere" una delle colonne, ma lasciare cmq alle altre la possibilità di usare lo spazio ad essa dedicato.

Per esercitarmi ho realizzato un layout a tre colonne usando solo float. Tuttavia quando imposto per la colonna più a destra width:0px; quest asparisce correttamente, ma la colonna centrale e di sinistra (contenute a loro volta in un div id="main con float:left) rimangono fisse alle dimensioni assegnate esplicitamente (giustamente). Tuttavia se per queste colonne imposto width:auto (o non imposto la width affatto) esse si prendono tutto lo spazio della pagina facendo scivolare in basso la terza colonna.

Come posso ottenere il layout voluto con la funzionalità di poter nascondere dinamicamente una colonna?
Grazie

dante Profilo | Junior Member

70 messaggi | Data Invio: gio 11 set 2008 - 21:20

Ciao!

Questo succede perchè cambi solo la dimensione del div che vuoi nascondere.

Da quanto ho capito non conosci cosa fanno i parametri dati nel foglio di stile.
Io partirei con lo studiare le regole css, almeno quelle che ti interessano. Poi cercherei di fare il tutto

comunque:
per posizionare i div, o altro, nella pagina non devi considerare solo le dimensioni di quello che ti interessa ma anche i margini(e non solo) dello stesso e degli elementi che lo circondano.

se il div in questione ha width:100px; devi dare a quello centrale il margine di 100 o piu'a sinistra.

se elimini il primo div o lo "nascondi" il secondo rimarra' posizionato dove prima dato il margine.

spero di essere stato chiaro ;)

ps: prima studia i css poi li utilizzi.
Dante

Torna su

Stanze Forum

Elenco Threads

Partecipa anche tu! Registrati!

Hai bisogno di aiuto ?
Perchè non ti registri subito?

Dopo esserti registrato potrai chiedere
aiuto sul nostro Forum oppure aiutare gli altri

Consulta le Stanze disponibili.

Registrati ora !