Tabelle con scrollbar verticale

**ciroverde** · 26-01-2006, 10:53

Buongiorno,
vorrei usare la scrollbar verticale per mostrare i dati presenti su una tabella.

ho pensato di suddividere la tabella principale in 2 tabelle:

1) la prima tabella contiene l'Intestazione
2) la tabella con i dati l'ho inserita in un <div> con scrollbar.

il tutto sembra funzionare bene, a meno dell'allineamento delle colonne di intestazione e dei dati.

Come faccio a fissare l'ampiezza delle colonne ?

la proprietà WIDTH non viene presa in considerazione nel momento in cui il testo delle celle va a capo automaticamente.

grazie per l'aiuto.

**Mich_** · 26-01-2006, 11:37

Ma perche` vuoi fare due tabelle?

Non sarebbe piu` logico usare i selettori <thead> e <tbody> all'interno della tabella e far scollare solo il <tbody>?
(per riferimento puoi vedere, ad esempio, http://www.w3schools.com/tags/default.asp ).

Che linguaggio HTML usi?
Se usi XHTML, ti posso spostare nel forum "CSS e XHTML", piu` adatto a trattare del codice XHTML; altrimenti ti sposto in HTML.

Il problema del width e` un problema essenzialmente IE (viene riconosciuto come min-width, per motivi storici)

**ciroverde** · 26-01-2006, 12:02

Ciao Mich,
grazie x la risposta.

Io vorrei far scrollare solo il <tbody> però non so come fare;

inoltre ho il problema dell'ampiezza delle colonne che mi varia a seconda del testo visualizzato.

Hai dei suggerimenti ?

**Mich_** · 26-01-2006, 12:13

Non hai risposto alla domanda sui linguaggi usati.

Se usi i CSS, la cosa e` semplice:

codice:

HTML:
<table>
  <thead>
    <tr>
      <th>titolo uno</th>
      <th>titolo due</th>
      ...
    </tr>
  </thead>
  <tbody>
    <tr>
      <td> ... </td>
      <td> ... </td>
    </tr>
    ...
  </tbody>
</table>

Il CSS:
table tbody {
  overflow: auto;
  height: ...; /* esprimere in %, em; meglio non  usare px */
}

**ciroverde** · 26-01-2006, 12:20

Non uso nessun linguaggio in particolare xchè utilizzo sia CSS, sia HTML che javascript (al momento uso una routine per ridimensionare le colonne della tabella).

Il mio problema principale è che uso IE6 e la proprietà width viene trattata come se fosse minWidth e mi perdo la formattazione delle tabelle.

**Mich_** · 26-01-2006, 12:27

Dovresti dichiarare il linguaggio che usi, altrimenti i browser interpretano come vogliono.

Se usi XHTML Strict e metti il DOCTYPE come prima riga, anche IE fa il "bravo" ed interpreta (quasi) come gli altri.

per il JS, ti conviene usarlo solo per IE, se necessario, in modo da rendere la pagina piu` standard possibile.

**ciroverde** · 26-01-2006, 13:27

- Ho modificato il tag

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

- Ho raggruppato tutte le righe in un TBODY

<tbody class="corpo" >

- Ho usato un CSS per tbody :
.corpo
{
overflow:scroll;color:navy;background:Yellow;heigh t:2em;
}

Purtroppo la tabella non visualizza le scroll bar...
anche xchè l'altezza del TBODY influenza l'altezza di ogni singola riga e non del blocco TBODY...

sto provando a leggere dal sito della MS e sembra che ci sia una collection di TBODY --> tbodies

**ciroverde** · 26-01-2006, 13:46

ho visualizzato la pagina HTML con Firefox 1.5 e il tbody viene mostrato con le scrollbar, la stessa pagina con IE invece non mostra nessuna scrollbar.

**Mich_** · 26-01-2006, 16:16

Ci sono siti che raccolgono gli hack da applicare ad IE per fare le diverse cose, tipo constile.org (non ricordo il link esatto).

Ne trovi fra i "link utili" di questo forum.

**ciroverde** · 27-01-2006, 16:39

Ciao Mich_,
Ho trovato un sito che indicava come fare per renderizzare le colonne di una tabella a dimensioni fisse (in IE width viene interpretata come minWidth); ho provato ad applicare il tip però i risultati non sono stati incoraggianti.

Stavo pensando di chiudere questo argomento e di aprire un nuovo argomento relativo alla gestione dell'ampiezza delle colonne in IE.

Tu che 6 uno dei moderatori, che ne pensi ?

Discussione: Tabelle con scrollbar verticale

Strumenti discussione

Ricerca discussione

Visualizza

Tabelle con scrollbar verticale

Bug di Internet Explorer 6

Permessi di invio