Come per la versione analoga con i float, anche in questo caso è consigliato
l'uso di un container aggiuntivo. Ecco quindi il codice HTML base:
<body>
<div id="container">
<div id="container2">
<div id="header"></div>
<div id="content"></div>
<div id="extra"></div>
<div id="navigation"></div>
<div id="footer"></div>
</div>
</div>
</body>
Le regole CSS da aggiungere sono semplici:
div#container{position: relative;
background:url(3rightcol.jpg) repeat-y top right
}
div#container2{background: url(3leftcol.jpg) repeat-y top left}
Anche qui basta semplicemente scegliere il tipo di layout. Ho preparato la versione con layout
fisso.
Scarica il file zip di esempio di questa lezione