<table> all'interno di <div>

[starbuck]

Ciao;

Ho il seguente problema:


ho una tabella all'interno di un div:

<div id="box">


.....</p>


......</p>
<table></table>
</div>

L'altezza del div è impostata su auto; tuttavia quando visualizzo la pg la tabella "supera" fuoriesce (verticalmente) dal div.

Come faccio per fare in modo che la tabella sia tutta contenuta all'interno del div box?

[ispuk]

impostando la stessa altezza della tabella al div?

[starbuck]

Ma al div ho impostato height:auto; perchè oltre a contenere la tabella contiene anche dei paragrafi, in questo modo l'altezza del div non dovrebbe automaticamente adattarsi alle dimensioni della tabella + quelle dei paragrafi in modo da contenere tutti gli elementi?

[ispuk]

uhm di solito io non uso auto, lascio senza dichiarazione height il div e tutto ciò che posiziono all'interno fa si che il div stesso prenda l'altezza giusta da sola

quindi ti consiglio di togliere proprio la regoletta "height" e di non dare nessun tipo di regola "position" a ciò che contiene

prova e dimmi se funziona

[starbuck]

Ho provato ma non funziona.

[ispuk]

uhm non saprei dovresti postare quella parte di codice

[miki003]

Come ti ha detto dovresti postare il codice con anche il contenuto, se ci dai un link ancora meglio

[starbuck]

Originariamente inviato da miki003
Come ti ha detto dovresti postare il codice con anche il contenuto, se ci dai un link ancora meglio

.box{
width:90%;
padding:8px;
border: 1px solid black;
background:white;
margin-bottom:10px;
margin-left:auto;
margin-right:auto;
padding-bottom:20px;
}

<div class="box">


…</p>


….</p>
<table cellspacing="1" cellpadding="1" border="0" align="left" style="padding-bottom: 20px; width: 300px;">
<tbody>
<tr>
<td>[img]/image/icona.jpg[/img]</td>
<td></td>
</tr>
<tr>
<td>[img]/image/icona.jpg[/img]</td>
<td></td>
</tr>
</tbody>
</table>


</p>
</div>

[Mich_]

Se usi formattazione HTML, ti metti nei pasticci da solo. I brwoser non sanno piu` cosa seguire (se HTML o CSS) e fanno quello che vogliono (e ognuno fa in modo diverso).

Quindi per prima cosa togli gli attributi HTML di formattazione (cellspacing="1" cellpadding="1" border="0" align="left") e spostali nel CSS.
Poi se vuoi limitare l'altezza di un oggetto (di tipo block, come la tabella), basta che a quell'oggetto dai uno dei seguenti attributi
max-height:
height:

Nota che questi non funzionano in IE6, mentre nelle versioni successive funzionano solo se sei in modalita` standard (quindi se usi una DTD strict)

Probabilmente dovrai usare anche l'attributo overflow, in modo da permettere lo scorrimento se il contenuto supera lo spazio disponibile.


PS: quando posti codice, usa i tag VB (ad esempio mediante il bottone # sopra l'area di inserimento), altrimenti si perde la formattazione e risulta difficile da leggere.

[starbuck]

Originariamente inviato da Mich_
Se usi formattazione HTML, ti metti nei pasticci da solo. I brwoser non sanno piu` cosa seguire (se HTML o CSS) e fanno quello che vogliono (e ognuno fa in modo diverso).

Quindi per prima cosa togli gli attributi HTML di formattazione (cellspacing="1" cellpadding="1" border="0" align="left") e spostali nel CSS.
Poi se vuoi limitare l'altezza di un oggetto (di tipo block, come la tabella), basta che a quell'oggetto dai uno dei seguenti attributi
max-height:
height:

Nota che questi non funzionano in IE6, mentre nelle versioni successive funzionano solo se sei in modalita` standard (quindi se usi una DTD strict)

Probabilmente dovrai usare anche l'attributo overflow, in modo da permettere lo scorrimento se il contenuto supera lo spazio disponibile.


PS: quando posti codice, usa i tag VB (ad esempio mediante il bottone # sopra l'area di inserimento), altrimenti si perde la formattazione e risulta difficile da leggere.

Funziona ;-) grazie mille.
In poche parole, per evitare complicazioni è sempre buona norm demandare tutto ciò che riguarda la formattazione ai fogli css...giusto?
Un'altra cosa; hai detto che le tabelle sono un oggetto di tipo block, cosa significa? E quali sono gli altri oggetti di tipo block?