Newsgroup: it.comp.www.html
Titolo: [css] estensione verticale div

Devo costruire un layout a 3 colonne + footer e header.
Ho deciso di utilizzare una tabella per la divisione in 3 colonne.
All'interno della colonna uno metterň un div per il menu, nella colonna
centrale un div per i contenuti, e in quella a destra un div per le
fotografie.
Esiste un modo per far sě che un div abbia una altezza che copra il 100%
della colonna che lo contiene? Provate a guardate alla pagina
http://www.parksmania.it/index.php?module=parchi
 Essendo la colonna centrale
piů corta di quelle laterali il bordo si interrompe. Se imposto il bordo
sulle colonne laterali, nelle pagine in cui quella centrale č piů lunga il
problema si ripropone.
Cosa mi consigliate?
Ciao!
--
Wildchild
Openoffice.org: l'alternativa gratuita (e buona) a MS Office.
http://it.openoffice.org


Hai gia' provato ad aggiungere un
     height: 100%;
allo stile (#content, mi pare)
Ciao,
Ema

 allo stile (#content, mi pare)
Sě, ma non funziona...
:(



Perche' non setti i bordi della tabella ad 1px:
table {border: 1px solid #000; border-collapse:collapse}
table td {border:1px solid #000}

 table td {border:1px solid #000}
Funge con i maggiori browser?


 Wildchild
Sicuramente funziona con ie6, mozilla 1.3+, opera 7, non so se funziona con
ie5 o ie5.5. Il problema e' il border-collapse. Se non viene accettato
bisogna definire il bordi interni dei td in modo che siano 1px.
Per es.:
table td#centro {border-left:1px solid #000; border-right:1px solid #000}
/* con #centro indico la cella centrale, ovviamente con apposito id */


A me funziona (IE6 e Mozilla 1.4):
<style>
a:hover {color:#ffffff}
#content {
     height: 100%;
 background-color: #FFFFFF;
 border-right-width: 1px;
 border-left-width: 1px;
 border-right-style: solid;
 border-left-style: solid;
 border-right-color: #000000;
 border-left-color: #000000;
}
</style>
<table width="254" height="117" border="1">
   <tr>
      <td width="143" height="30" >&nbsp;</td>
      <td width="143" height="30" >&nbsp;</td>
      <td width="143" height="30" >&nbsp;</td>
   </tr>
   <tr>
      <td width="143" height="30" >&nbsp;</td>
      <td width="143" rowspan="2" align="center">
         <br />
         <br />
         <br />
         <br />
         <br />
         <br />
         <br />
         <br />
         <br /></td>
      <td width="143" height="30" >&nbsp;</td>
   </tr>
   <tr>
      <td width="143"><div id="content">Ciao</div></td>
      <td width="143">&nbsp;</td>
   </tr>
</table>
Ciao,
Ema

 apposito id */
Grazie!
Accade però una cosa strana... ho usato il seguente selettore:
table#bordata {
 border: 1px solid #000;
 border-collapse:collapse;
}
table#bordata td {
 border:1px solid #000;
}
Come tu mi hai consigliato. Il problema è che viene applicata la
formattazine del bordo anche a tutte le tabelle che sono contenute nella
tabella #bordata. Come posso fare un modo che le dichiarazioni di cui sopra
siano applicate solo alla tabella padre?
Ciao!


 siano applicate solo alla tabella padre?
Non avevo tenuto presente altre tabelle all'interno delle celle. A questo
punto forse e' meglio definire uno stile per i td principali:
Per es.:
td.tdbordata {border:1px solid #000}
Ciao.

 td.tdbordata {border:1px solid #000}
Ok, grazie. Ma non esiste una dichiarazione che blocchi la cascata
padre-figlio (mi rivolgo a tutti).


WildChild ha scritto:
| Ok, grazie. Ma non esiste una dichiarazione che blocchi la cascata
| padre-figlio (mi rivolgo a tutti).
| Ciao!
Ciao WildChild,
    c'e' il child selector, che però non funziona su ie...
nel tuo caso il css sarebbe stato qualcosa di simile:
table#bordata > tr > td {
 border:1px solid #000;
}
Non ne sono sicuro che sia così e il sito del selectoracle è down.
Comunque la regola dice di applicare la regola ai td dei tr figli diretti della
tabella con id="bordata". Come ti hanno suggerito, conviene usare i bordi
sulla tabella e una classe per i td con i bordi.
Saluti,
    SantaKlauss