|
|||||||
|
|
|
 |
|
|
Strumenti |
19-06-2011, 23:30
|
#1 |
|
Senior Member
Iscritto dal: Sep 2002
Città: Celano (AQ) Segno_Zodiacale: Leone Ascendente: Cammello Segni_Particolari: Quello
Messaggi: 9571
|
[CSS] Semplice colonna a sinistra
L'idea è semplice: header, contenuto e footer.
Nel contenuto c'è un menu a sinistra che deve essere alto quanto il contenuto. Perchè per fare ciò sto diventando matto? Incollo qui il codice della pagina e uno screenshot di come la vedo con firefox. Io vorrei che il menu rosso sia alto come tutto il contenuto e che ovviamente si adatti in altezza se il contenuto si allunga. Qualcuno mi sa aiutare? EDIT Dopo varie peripezie sono giunto più o meno alla versione finale, però le visualizzazioni con IE9 e Firefox sono differenti. Con Firefox la visualizzazione è corretta. Con IE no, in special modo ci sono dei fastidiosi spazi verticali tra le varie parti del layout. Si può risolvere in qualche modo? -----> Visualizzazione con Internet Explorer 9 <----- -----> Visualizzazione con Mozilla Firefox 5 <----- Codice:
<html>
<head>
<style type="text/css">
#header {
min-height: 100px;
background-color: blue;
}
#main {
background-color: silver;
}
#footer {
min-height: 100px;
background-color: grey;
clear: both;
}
#leftmenu {
width: 10%;
background-color: red;
}
#content {
background-color: yellow;
}
#leftmenu, #content {
height: auto;
float: left;
}
</style>
</head>
<body>
<div id="header">
<h1>Header</h1>
</div>
<div id="main">
<div id="leftmenu">
<h3>Left Menu</h3>
</div>
<div id="content">
<h3>Content</h3>
</div>
</div>
<div id="footer">
<h3>Footer</h3>
</div>
</body>
</html>
Ultima modifica di VegetaSSJ5 : 23-06-2011 alle 14:26. |
|
|
|
20-06-2011, 09:04
|
#2 |
|
Senior Member
Iscritto dal: Oct 2006
Città: milano
Messaggi: 1439
|
Prova con qualcosa tipo
Codice:
#leftmenu, #content {
height: 100%;
float: left;
}
|
|
|
|
|
20-06-2011, 11:11
|
#3 |
|
Senior Member
Iscritto dal: Sep 2002
Città: Celano (AQ) Segno_Zodiacale: Leone Ascendente: Cammello Segni_Particolari: Quello
Messaggi: 9571
|
ehm... no!
ho aggiornato l'immagine e il codice al primo post... |
|
|
|
|
21-06-2011, 16:35
|
#4 |
|
Senior Member
Iscritto dal: Sep 2002
Città: Celano (AQ) Segno_Zodiacale: Leone Ascendente: Cammello Segni_Particolari: Quello
Messaggi: 9571
|
up!
|
|
|
|
|
23-06-2011, 13:40
|
#5 |
|
Member
Iscritto dal: Apr 2011
Messaggi: 59
|
Ciao, il cambiamento da fare è qui
Codice:
#leftmenu, #content {
height: auto;
min-height:300px;
float: left;
}
|
|
|
|
|
23-06-2011, 14:19
|
#6 |
|
Senior Member
Iscritto dal: Sep 2002
Città: Celano (AQ) Segno_Zodiacale: Leone Ascendente: Cammello Segni_Particolari: Quello
Messaggi: 9571
|
Grazie mille Efem!
ora il layout c'è... ho fatto qualche altra piccola modifica al css per renderlo minimale. però explorer mi visualizza degli spazi tra le varie parti del layout, invece firefox le visualizza bene... il codice aggiornato e le immagini sono al primo post. |
|
|
|
|
|
| Strumenti | |
|
|
Tutti gli orari sono GMT +1. Ora sono le: 22:18.
