[CSS] problemi con tabelline!!

[lisa76]

Ciao, sto provando a costruire il mio primo sito senza tabelle, posizionato solo con fogli di stile...ho qualche problema con l'altezza di tre colonne affiancate: per semplificare, ho fatto due gif, una con il risultato attuale e l'altra con quello che vorrei ottenere...

esempio sbagliato

esempio corretto


In pratica sono 3 colonne di cui però non posso sapere a priori l'altezza precisa, solo la larghezza. E però mi serve che si adattino tutte al contenuto "massimo"...cioè, se la 2a colonna, come nell'esempio, contiene un certo giorno più news delle altre, deve "stirarsi" insieme al suo colore di sfondo, e le altre devono fare altrettanto (adattarsi cioè tanto alla propria altezza quanto a quella delle altre colonne); ho già provato varie combinazioni di "100%", auto etc etc, ma devo essere sulla via sbagliata...che dite, si può ottenere una cosa del genere solo con dei CSS, senza usare tabelle? Grazie grazie cmq, un beso

lisa

[lisa76]

whoooops avevo dimenticato il codice sorgente :quote:

--------CODICE CSS----------------------------------
#c_offerte {
	background-color: #FFB888;
	width: 260px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333333;
	float: left;

}

#c_news {
	background-color: #E4E4E4;
	float: left;
	width: 212px;
	border-right-width: 1px;
	border-right-style: solid;
	border-right-color: #333333;
	padding: 8px;

}

#c_flash {
	width: 280px;
	float: left;
	background-color: #FFFFFF;
	clear: right;
	height: 500px;
}

#3tabelline {
	clear: both;
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #333333;
	background-color: #FFFFFF;
	height: auto;
}



-------CODICE HTML-----------------------------------

<div id="3tabelline">
	<div id="c_offerte">  
	  

offerte	</p>
	  <ul>
	[*]News n&deg; 1
	[*]News n&deg; 2 
	[*]News n&deg; 3 
	[*]News n&deg; 4 
	[*]News n&deg; 5 
	[*]News n&deg; 6 
	[*][/list]
	</div>
	<div id="c_news"> 

news</p>
	  

d</p>
	  <ul>
	[*]News n&deg; 1
	[*]News n&deg; 2 
	[*]News n&deg; 3 
	[*]News n&deg; 4 
	[*]News n&deg; 5 
	[*]News n&deg; 6 
	[*]News n&deg; 7 
	[*]News n&deg; 8 
	[*]News n&deg; 9 [/list]
	</div>
	<div id="c_flash">  flash	</div>
</div>
--------CODICE CSS----------------------------------

ciauzzzz

[maioenrico]

questo è il problema con cui sto combattendo pure io da un bel po'...se riesco a trovare la soluzione ti avverto...

[pacovox]

Non esiste un sistema che permetta di legare due o più colonne rendendole dipendenti in altezza, l'unico modo è quello di usare un colore di sfondo o, come nel tuo caso, un'immagine alta pochi px e larga quanto il box che contiene le tre colonne da ripetersi in verticale.
In questo modo simuli l'altezza delle tre colonne anche se in realtà rimangono fisse con la loro altezza.