colonne che aumentano in altezza insieme

[robo12]

salve, ho lo sfondo della pagina grigio e due colonne (una per il contenuto e una per il menu) di colore bianco. Ora succede che le colonne aumentano di dimensione in modo diverso a seconda del contenuto, per cui mi ritrovo un brutto effetto "a scala". Come faccio a far in modo, ad esempio, che se nel div del contenuto c'è molto testo, il div del menu a destra lo segua comunque anche se non ha altro contenuto? Grazie.

[Another-Life]

Non ho ben capito cosa vuoi fare...magari posta il codice Xhtml+Css oppure qualche screenshot.

[robo12]

ecco lo screenshot. Io vorrei che anche se la colonna di destra non ha molto contenuto, si allunghi fino a seguire quella di sinistra.

Il codice xhtml:
<div id="wrapper">
<div id="content">Content for id "content" Goes Here


Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec quam. Cras faucibus, justo vel accumsan aliquam, tellus dui fringilla quam, in condimentum augue lorem non tellus. Pellentesque id arcu non sem placerat iaculis. Curabitur posuere, pede vitae lacinia accumsan, enim nibh elementum orci, ut volutpat eros sapien nec sapien. Suspendisse neque arcu, ultrices commodo, pellentesque sit amet, ultricies ut, ipsum. Mauris et eros eget erat dapibus mollis. Mauris laoreet posuere odio. Nam ipsum ligula, ullamcorper eu, fringilla at, lacinia ut, augue. Nullam nunc.</p>
</div>
<div id="rightmenu">Content for id "left" Goes Here


Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem.</p><div class="clearit"></div>
</div>
</div>

Il codice css:

#rightmenu {
background: #FFF;
float: left;
width: 195px;
height: auto;
}

#content {
float: left;
background: #FFF;
width: 555px;
margin: 0;
padding: 10px;
}

.clearit{
clear: both;
}

[Another-Life]

Lo screenshot non l'hai inserito...cmq per quanto riguarda il problema prova ad inserire la proprieta
min-height: 100%; al selettore #rightmenu.Ovviamente devi assicurarti che entrambe le sezioni(div) sia contenute all'interno di un un altra sezione(div) con altezza del 100%.

[robo12]

fatto ma non cambia nulla.

<div id="contentbox">
<div id="content">Content for id "content" Goes Here


Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem,

consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae

purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec

quam. Cras faucibus, justo vel accumsan aliquam, tellus dui fringilla quam, in condimentum

augue lorem non tellus. Pellentesque id arcu non sem placerat iaculis. Curabitur posuere,

pede vitae lacinia accumsan, enim nibh elementum orci, ut volutpat eros sapien nec sapien.

Suspendisse neque arcu, ultrices commodo, pellentesque sit amet, ultricies ut, ipsum. Mauris

et eros eget erat dapibus mollis. Mauris laoreet posuere odio. Nam ipsum ligula, ullamcorper

eu, fringilla at, lacinia ut, augue. Nullam nunc.</p>
</div>
<div id="rightmenu">


Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem,

consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem.</p>
</div>
</div>


Il css:

#contentbox {
background: transparent;
text-align: left;
height: 100%;
}

#rightmenu {
background: #FFF;
float: left;
width: 195px;
min-height: 100%;
}

#content {
float: left;
background: #FFF;
width: 535px;
margin: 0;
padding: 20px;
}

.clearit{
clear: both;
}

[salasir]

Se non ho capito male, tu hai uno sfondo per la colonna più corta che non si estende alla lunghezza di quella più lunga. Giusto?

Se ho interpretato bene, devi utilizzare la tecnica delle faux columns (false colonne).
Qui trovi una spiegazione, e leggi anche i rimandi interni su A List Apart:
http://css.html.it/articoli/leggi/4...ne-con-i-css/5/

[robo12]

è esattamente quello che intendevo, ma non riesco a raggiungere il link che mi hai dato. Lo scriveresti per intero? Grazie.

[salasir]

Riprova. L'avevo troncato.

[Another-Life]

Originariamente inviato da salasir
Se non ho capito male, tu hai uno sfondo per la colonna più corta che non si estende alla lunghezza di quella più lunga. Giusto?

Se ho interpretato bene, devi utilizzare la tecnica delle faux columns (false colonne).
Qui trovi una spiegazione, e leggi anche i rimandi interni su A List Apart:
http://css.html.it/articoli/leggi/4...ne-con-i-css/5/

Secondo me non è il metodo migliore...percaso hai qualche altra soluzione se volessi solamente allungare una delle due colonne senza intervenire con la proprietà background??

[robo12]

infatti io ricordavo di una soluzione diversa, che non facesse ricorso ad un espediente del genere. Continuo a cercare.