Ciao ragazzi volendo cominciare ad usare i css per la creazione del layout delle pagine (in molti sono a decantarne i vantaggi rispetto ale tabelle) mi sono subito imbattuto in questo problema.
Con le tabelle posso facilmente creare un design liquido in cui una cella che risulta come colonna rossa di sinistra si estende per tutta l'altezza della pagina indipendentemente dal contenuto inserito nella seconda cella di dx in cui per ipotesi inserirei tutto il contenuto della pagina
vedi esempio sotto:
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>
<body bgcolor="#FFFFFF" text="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="100%" border="0" cellspacing="0" cellpadding="0" height="100%">
<tr>
<td width="122" bgcolor="#CC0033">a</td>
<td bgcolor="#FFFFCC">b</td>
</tr>
</table>
</body>
</html>
A differenza di un layout realizzato con i div ed il posizionamento tramite css:
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
<!--
function MM_reloadPage(init) { //reloads the window if Nav4 resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
// -->
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<div id="Layer1" style="position:absolute; left:0; top:0; width:120; height:100%; z-index:1; background-color: #CC0033; layer-background-color: #CC0033; border: 1px none #000000"></div>
<div id="Layer2" style="position:absolute; left:203px; top:43px; width:456px; height:96px; z-index:2; background-color: #FFFFCC; layer-background-color: #FFFFCC; border: 1px none #000000">
testo di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di prova</p>
testo di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di prova</p>
testo di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di prova</p>
testo di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di provatesto di provatesto di provatesto di provatesto
di provatesto di provatesto di prova</p>
</div>
</body>
</html>
in cui se il testo inserito in un secondo div supera l'altezza della pagina visualizzatami in Dreamweaver il primo div impostato su un'altezza del 100% non si estende per tutta l'altezza max della pagina determinata dal testo inserito del secondo div.
Come posso fare tramite CSS per creare un layout identico al primo codice postato ovvero con le tabelle, conosco abbastanza i CSS e ho letto tutta la guida di html.it a riguarda ma non riesco a venirne a capo.
Rispondi quotando
