Istruzioni

Tenete presente che il codice CSS di questi layout contiene molti commenti. Se solitamente lavorate nella vista Progettazione, visualizzate almeno momentaneamente la vista Codice per consultare i suggerimenti sull'uso del codice CSS nei layout liquidi. Potete rimuovere questi commenti prima di lanciare il sito. Per saperne di più sulle tecniche utilizzate in questi layout CSS, leggete questo articolo sul Centro per gli sviluppatori Adobe - http://www.adobe.com/go/adc_css_layouts.

Metodo di clearing

Poiché tutte le colonne sono con float, questo layout utilizza una dichiarazione clear:both nella regola .footer. Questa tecnica di clearing obbliga il .container a capire dove terminano le colonne per fare apparire i bordi o i colori di bordo che applicate al .container. Se il vostro design richiede la rimozione di .footer dal .container, dovete utilizzare un metodo di clearing differente. Quello più affidabile prevede l'aggiunta di un <br class="clearfloat" /> o <div class="clearfloat"></div> dopo l'ultima colonna con float (ma prima della chiusura del .container). L'effetto di clearing sarà lo stesso.

Sostituzione logo

In questo layout è stata utilizzata un'immagine segnaposto nell'area .header, nel punto in cui probabilmente inserirete un logo. Si consiglia di rimuovere il segnaposto e sostituirlo con il vostro logo collegato.

Tenete presente che se utilizzate la finestra di ispezione Proprietà per accedere all'immagine del logo utilizzando il campo Orig. (anziché rimuovere e sostituire il segnaposto), dovrete rimuovere le proprietà di visualizzazione e sfondo in linea. Questi stili in linea vengono utilizzati solo per fare apparire il segnaposto del logo nei browser a scopo di dimostrazione.

Per rimuovere gli stili, controllate che il pannello Stili CSS sia visualizzato nella versione Corrente. Selezionate l'immagine e, nel riquadro Proprietà del pannello Stili CSS, fate clic con il pulsante destro ed eliminate le proprietà di visualizzazione e sfondo (display e background). (Naturalmente potete sempre accedere direttamente al codice ed eliminare manualmente gli stili in linea dall'immagine o dal segnaposto.)

Commenti condizionali di Internet Explorer

Questi layout liquidi contengono un commento condizionale di Internet Explorer (IECC) che consente di correggere due problemi.

1. I browser eseguono tutti allo stesso modo l'arrotondamento delle dimensioni dei div nei layout basati su percentuale. Quando il browser esegue il rendering di un valore come 144,5 px o 564,5 px, deve arrotondarlo al numero intero più vicino. Safari e Opera arrotondano per difetto, Internet Explorer per eccesso e Firefox arrotonda una colonna per eccesso e una per difetto riempiendo completamente il container. Queste diverse modalità di arrotondamento possono determinare delle differenze in alcuni layout. Questo IECC specifica un margine negativo di 1 px per correggere il problema in IE. Potete spostarlo in qualunque colonna (a sinistra o a destra) a seconda delle vostre necessità di layout.
2. La proprietà zoom è stata aggiunta all'ancoraggio all'interno dell'elenco di navigazione poiché, in alcuni casi, viene eseguito il rendering dello spazio vuoto supplementare in IE6 e IE7. Zoom fornisce a IE la sua proprietà hasLayout per correggere questo problema.