Tabella e css

[Fedes]

Ciao,

ho un problema con la formattazzione di una tabella. Vorrei che le celle fossero di una larghezza prestabilita (es. 50px) in modo che il testo inserito all'interno vada a capo dopo questi 50 px. Ho inserito una larghezza width:50px nella classe td. La cella si adatta alla larghezza ma se inserisco testo questo allarga la cella.

Inoltre la tabella è inserita all'interno di un layout a due colonne la cui colonna di destra (in cui è inserita la tabella) è liquido. Ora la tabella se è costituita da più celle esce dalla colonna.

Mi sapete dare qualche dritta.

Grazie

Ciao

[fcaldera]

intanto assegna una larghezza massima alla tabella
poi posta un link alla pagina o mostra il codice html e css che stai usando.

[Fedes]

Ciao Fabrizio,

grazie della risposta.

Ho provato ad aggiungere un width auto (o 100%) senza però risolvere il problema.

di seguito il link della pagina con il css interno

http://www.fedegrafia.com/forum/tabella_css.htm

Mentre in Firefox la tabella rimane all'interno di colonna 2 in ie fuoriesce.

Inoltre se la parola all'interno della cella è troppo lunga ("corrispondentemente") allarga la cella invece di andare a capo.

grazie e ciao

[fcaldera]

purtroppo non puoi fare molto in questa situazione.
Ogni cella si allargherà tanto quanto la parola più lunga presente al suo interno e questo comportamento prevale sulla larghezza impostata di cella e tabella

Se per te è accettabile potresti inserire la tabella (senza dimensioni vincolate) all'interno di un div
a questo div darai width: ... px , overflow-x: scroll; e un padding-bottom di 25px circa;

In questo modo la tabella sarà libera di ridimensionarsi a piacimento ma se dovesse superare la larghezza del contenitore apparirà la scrollbar orizzontale.


Altrimenti potresti usare una soluzione in javascript attraverso la quale inserisci dinamicamente uno spazio vuoto ogni x caratteri delle celle in modo da far andare 'a capo' la parola,

[gengix]

Neanche inserendo:

     table {
     table-layout:fixed;
     width:auto;
     }

Riesci a saltarci fuori?
Oppure impostando sempre table-layout al valore fixed e inserendo nella struttura gli elementi <col>, dando a questi degli id e impostando loro delle dimensioni fisse.
La proprietà che ti ho postato dovrebbe avere la prevalenza sul testo. Prova a vedere se funziona.

[Fedes]

Grazie per le risposte:

@fcaldera: penso che la soluzione del div con overflow sarà quella che userò. Ottima anche l'idea del javascript!

@gengix:
ho provato con table-layout:fixed; effettivamente la tabella si comprime ma le ultime celle poi risultano illeggibili (cosa molto strana).Proverò la soluzione "col" anche se al momento non lo ho mai usato come tag.

ciao e grazie ancora

[Fedes]

Ciao

chiedo cortesemente un aiuto per capire se è possibile o meno che ie 6/7 abbia lo stesso comportamento di FF in relazione alla tabella presente nella colonna di destra.

qui il link:

http://www.fedegrafia.com/forum/tabella_css.htm

In Firefox la tabella allarga il layout e quindi appaiono sotto le scrollbars. In ie invece la tabella fuoriesce e non riesco in alcun modo a fare si che la tabella allarghi il layout (come avviene in FF) e mi appaiano sotto le scrollbars.


grazie

Fede