La posta di Edit: layout con i CSS

Ricevo spesso molte email di lettori di HTML.it o del blog, con le domande più disparate, insieme a molte email provenienti dall'articolo sui Nifty Corners in inglese. Antispam e tempo permettendo, cerco di rispondere... ma vorrei approfittare per scusarmi con quanti mi hanno scritto e non hanno ricevuto risposta.

Ho trovato molto interessante però l'idea de la posta di Edit di Cesare, e vorrei riprendere l'idea. L'alto giorno mi ha scritto Anna, ponendomi una domanda molto interessante e che, riflettendoci, non trova una risposta precisa nei molti articoli che ho scritto. Credo che possa essere utile a molti quindi riporto volentieri il carteggio. Anna scrive:

Vorrei chiederle un'informazione sul layout a due colonne con float. àˆ necessario,
qualsiasi sia la disposizione della navigazione nella pagina web (a destra o a sinistra),
che la navigazione preceda i contenuti? Per quale motivo? Per risolvere questo problema devo necessariamente utilizzare i float opposti?

Segue la mia risposta.

Ci sono diversi modi per ottenere un layout a due colonne con la navigazione in ordine di HTML dopo i contenuti. Ai tempi della guida sul layout con i CSS di HTML.it non erano ancora ben definite alcune tecniche che in seguito si sono rilevate
molto potenti e versatili nel superare il limite dell'ordine di contenuti-navigazione. Tecniche che sono documentate in molti articoli nella sezione CSS.

Tra queste, oltre ai posizionamenti assoluti, ci sono ad esempio i margini negativi:

• Margini negativi
• Layout con i margini negativi
• Layout Gala con la relativa pagina indice

Per quanto riguarda i float opposti, tre letture sono:

• Float: teoria e pratica
• Layout a tre colonne tutto float
• Un layout falso liquido

La mia opinione: se è sicuro che la colonna di navigazione sarà  sempre più corta dei contenuti (oppure non c'è la necessità  di un footer a tutto campo) si possono usare i posizionamenti assoluti sia per un layout liquido che fisso.

In caso contrario: se il layout è a larghezza fissa (o liquido con le due colonne percentuali) e c'è la necessità  del footer che si disponga sul fondo indipendentemente dalla lunghezza di contenuti e navigazione, sono da preferire i float opposti.

Infine: se il layout è liquido, ma la colonna secondaria è a larghezza fissa, la soluzione migliore è senza dubbio i margini negativi.