Newsgroup: it.comp.www.html
Titolo: [CSS] Sfondo del div che non segue la lunghezza del testo

Salve a tutti,
ho una pagina fatta con 2 div e css.
Sulla colonna sinistra ho un sfondo colorato e sulla colonna di centro 
ho del testo. Entrambi i div hanno la stessa altezza definita nel css e 
sono uno accanto all'altro.
Se all'interno del div di centro viene caricata una pagina con un gran 
numero di righe questo si espande in altezza. Il div di sinistra invece 
non si allunga alla stessa maniera. Io vorrei invece che il colore del 
div di sinistra avesse la stessa lunghezza di quello di centro.
E' possibile?
Ho provato a mettere l'altezza pari a 100% ma credo che, visto che il 
div di centro viene eseguito dopo il div di sinistra, questo 
prolungamento del colore non sia possibile. Ho ragione?
Grazie!
--
Newsgroup robomoderato - gli articoli vengono approvati automaticamente

Peca's ha scritto:

è possibile, una soluzione sono le "faux columns" e puoi trovare un 
tutorial qui 
www.carnackyweb.com/?p=37
 su come implementare tale soluzione
spero possa esserti utile, ciao ciao


 tutorial qui 
www.carnackyweb.com/?p=37
 su come implementare tale soluzione
Innanzitutto grazie per la risposta.
In realtà già conoscevo questa tecnica ma non sapevo avesse un nome. Al 
max la chiamavo "div annidati". Il problema però è che si parte dal 
presupposto che nella pagina sicuramente una delle 2 colonne gestisce la 
dimensione della pagina. Nell'esempio riportato nel sito la pagina 
centrale gestisce la dimensione della pagina. Ma nel mio sito può essere 
sia la colonna di sinistra che la colonna di destra ad allungare la 
pagina in base ai contenuti dinamici che vengono caricati. Siccome hanno 
2 colori differenti non posso mettere 2 sfondi differenti.
Mi scuso per non averlo descritto nel primo post.
Come fare?


 Come fare?
In un caso molto simile (il numero delle colonne era variabile) ho 
risolto con javascript: all'evento onload veniva controllata l'altezza 
dei vari div e, trovata la maggiore, li si ridimensionava tutti.
Ciao,
Paolo


 2 colori differenti non posso mettere 2 sfondi differenti.
Puoi modificare il faux columns cosi`:
<div class="container">
 <div class="primacolonna"></div>
 <div class="secondacolonna"></div>
</div>
primacolonna e secondacolonna saranno due float (left e right, per 
esempio), container avra` "overflow:auto;" e il background formato da una 
gif/png larga esattamente quanto lui, alta un pixel, con i primi n 
(larghezza di primacolonna) a sinistra di un colore, e i restanti di un 
altro. La ripeti verticalmente.
In questo modo "container" si adegua all'altezza del piu` alto dei suoi 
figli, quindi ripete lo sfondo fino alla fine della sua altezza, simulando 
il colore per entrambe le colonne.
Bye.


 dei vari div e, trovata la maggiore, li si ridimensionava tutti.
Ti scoccia inserire il codice che hai usato?
Grazie


Forse ho capito come ha fatto lui. Ha unito i due sfondi in un'unica 
immagine e li ha posti come sfondo. L'idea in questo caso non è male. La 
dovrei provare per capire se posso effettivamente renderla compatibile.
Cmq grazie!


 il colore per entrambe le colonne.
Ti ringrazio perchè nella mia testa stavo già pensando a questa stessa 
soluzione. Per fortuna che il div "container" già lo avevo previsto 
nella struttura.
Grazie ancora a tutti. Vi farò sapere x qualche feedback.


 Ti scoccia inserire il codice che hai usato?
A ritrovarlo... è un lavoro spot di 3-4(-5) anni fa.
Comunque la cosa era abbastanza banale: ogni div aveva indicato l'id, 
via javascript ricavavo l'elemento con getElementById [1] e ne leggevo 
l'altezza dallo style [2].
Confrontate le varie altezze applicavo a tutti i div quella maggiore.
Ciao,
Paolo
[1] 
http://developer.mozilla.org/en/docs/DOM:document.getElementById
[2] 
http://www.webmasterworld.com/forum91/3429.htm


 [2] 
http://www.webmasterworld.com/forum91/3429.htm
Grazie 1000 vedo come metterlo a posto x il mio sito e verifico quale 
delle 2 proposte è più indicata!
Ciao.
