ciao! sono sempre alle prime armi, e sto provando ad impostare una semplice pagina a tre colonne con i CSS.
non riesco a fare in modo che la colonna di sinistra si allunghi fino a sotto, fino all'attacco del footer.
tra l'altro non ho ancora ben compreso l'uso del padding, ma recupererò!
sapete dirmi che cosa sbaglio o cosa ho tralasciato di mettere?
ecco di seguito il codice html e il relativo file css:
<!DOCTYPE html PUBLIC"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>GIF idea</title>
<link rel=”stylesheet” type=”text/css” href=”foglio27.css”/>
</head>
<body>
<div id=”container”>
<div id=”header”>
<h1>GIF idea grafica illustrazione fotografia</h1>
</div>
<div id=”navigation”>
<div class=”voci menu”>
<ul>[*]portfolio[*]un po’ di me[*]cont@tti[*]area clienti[/list]
</div>
</div>
<div id=”extra”>
<div class=”testo lat”>
<h2> anteprime lavori</h2>
</div>
</div>
<div id=”content”>
qui ci vanno i lavori ingranditi</p>
</div>
<div id=”footer”>
2008- grafica e layout sono a cura di paola baccigalupi – GIF idea 2008
</div>
</div>
</body>
</html>
CSS
* {
margin: 0;
padding: 0;
}
Div#container{background-color: #7C9BCF;}
Div#navigation{float: right; width: 170px; background-color: #EE71A2; padding: 1em 5px; text-align: center;}
Div#extra{float: left; width: 170px; background-color: #EE71A2; padding: 1em 0 0 10px; text-align: center; }
Div#content{margin: 0 170px; text-align: center; }
Div#header{background-color: #E3007B}
H1{color: black; font-size: 1.2em;}
H2{color:black; font-weight: normal; font-size: 1em; }
Div#content p{margin-top: 50px;}
Li{list-style-type: none; text-align:left; line-height: 120%; margin-left:10px;}
Div#footer{background-color: #E3007B; clear:both; text-align: center;}
Div#extra div.testo lat{margin-bottom:2em;}
grazie a tutti!
paola

Rispondi quotando