Eliminare scrollbar orizzontale in un tbody con gestione dell'overflow

**d_d_s** · 26-08-2005, 00:29

Ciao a tutti. Ho questoproblema che mi sta facendo letteralmente scervellare: sto gestendo tramite tbody e overflow il contenuto dinamico di una tabella ke altrimenti sarebbe troppo lunga. Fin qui tutto bene; il contenuto è visualizzato perfettamente e tutto funziona, se non fosse per quella dannata scrollbar orizzontale che appare sempre, nonostante il contenuto della tabella sia notevolmente inferiore come larghezza a quella totale. E' possibile eliminarla per sempre? Ho letto da qualche parte che potrebbe essere possibile farlo con display, ma nn saprei che valore assegnargli...

'Azie...

**d_d_s** · 26-08-2005, 17:27

Uhm, come potrei almeno creare in un diverso modo una struttura tabellare che possa essere gestita da una scrollbar verticale? Vi prego, sono rimasto senza risorse...

**Zero** · 26-08-2005, 19:10

Ho scritto qualcosina, giusto per farti un esempio pratico.. Spero vada bene (la solita mancanza di tempo mi impedisce di testare

)

codice:

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

<html>
<head>
<title>Untitled</title>
<style type="text/css">
table {
border: 1px solid blue; 
border-collapse: separate;
border-spacing: 1px; 
table-layout: fixed; 
width: 250px;
}
		
td {padding: 3px; 
background-color: #eee; 
white-space: nowrap; 
overflow: hidden;
height: 20px;
}
		
thead td {
font-weight: bold; 
border: 1px outset;
}
		
.mezzo {
height: 100px; 
overflow: auto;
}
		
.mezzo {
width: 267px; 
overflow-y: scroll;
}

</style>	
<div id="sopra">
<table  border="1" summary="Test table for scrollable TBODY table regions">
     <thead>
     <tr>
       <th rowspan="1" colspan="1">Titolo Tabella</th>
     </tr>
   </thead>
</table>
</div>

<div class="mezzo" style="height: 100px; overflow: auto">
<table border="1" summary="Test table for scrollable TBODY table regions">
   <thead style="display: none">
     <tr>
       <th rowspan="1" colspan="1">Riga</th>
       <th rowspan="1" colspan="1">1</th>
       <th rowspan="1" colspan="1">2</th>
       <th rowspan="1" colspan="1">3</th>
       <th rowspan="1" colspan="1">4</th>
     </tr>
   </thead>
   <tfoot style="display: none">
     <tr>
       <th rowspan="1" colspan="1">Riga</th>
       <th rowspan="1" colspan="1">1</th>
       <th rowspan="1" colspan="1">2</th>
       <th rowspan="1" colspan="1">3</th>
       <th rowspan="1" colspan="1">4</th>
     </tr>
   </tfoot>
   <tbody>
     <tr>
       <th rowspan="1" colspan="1">Riga</th>
       <th rowspan="1" colspan="1">1</th>
       <th rowspan="1" colspan="1">2</th>
       <th rowspan="1" colspan="1">3</th>
       <th rowspan="1" colspan="1">4</th>
     </tr>
     <tr>
       <th rowspan="1" colspan="1">Riga</th>
       <th rowspan="1" colspan="1">1</th>
       <th rowspan="1" colspan="1">2</th>
       <th rowspan="1" colspan="1">3</th>
       <th rowspan="1" colspan="1">4</th>
     </tr>
     <tr>
       <th rowspan="1" colspan="1">Riga</th>
       <th rowspan="1" colspan="1">1</th>
       <th rowspan="1" colspan="1">2</th>
       <th rowspan="1" colspan="1">3</th>
       <th rowspan="1" colspan="1">4</th>
     </tr>
     <tr>
       <th rowspan="1" colspan="1">Riga</th>
       <th rowspan="1" colspan="1">1</th>
       <th rowspan="1" colspan="1">2</th>
       <th rowspan="1" colspan="1">3</th>
       <th rowspan="1" colspan="1">4</th>
     </tr>
     <tr>
       <th rowspan="1" colspan="1">Riga</th>
       <th rowspan="1" colspan="1">1</th>
       <th rowspan="1" colspan="1">2</th>
       <th rowspan="1" colspan="1">3</th>
       <th rowspan="1" colspan="1">4</th>
     </tr>
   </tbody>
</table>
</div>
<div id="sotto">
<table border="1">
   <tfoot>
     <tr>
       <th rowspan="1" colspan="1">Fondo Tabella</th>
     </tr>
   </tfoot>
</table>
</div>
</body>
</html>

**d_d_s** · 26-08-2005, 19:34

Grazie, xò purtroppo continua ad uscire la scrollbar orizzontale...

**Zero** · 26-08-2005, 19:40

Originariamente inviato da d_d_s
Grazie, xò purtroppo continua ad uscire la scrollbar orizzontale...

Sei certo ?.. Io lo sto guardando con firefox e IE6 e non esce nessuna barra orizzontale.. C'è solo la verticale

**d_d_s** · 26-08-2005, 19:44

con ie nn esce, ma con ff a me si... :master:

**Zero** · 27-08-2005, 00:16

Mi sembra strano.. Ti ho allegato come la vedo io, sia su ff, che su ie..

Mi faresti uno screen di come ti si visualizza su Ff ?

Nota: lo screen l'ho ritagliato dalla pagina vista usando Firefox

**d_d_s** · 27-08-2005, 00:28

Scusami ma nn era il tuo script ke nn andava... Naturalmente era Winzozz ke dava problemi; era la skin di windows. Eliminandola fila tutto liscio come l'olio...

Comunque c'è anche un altro modo per risolvere il problema: Inserire un div dimensionato e con overflow:auto nella opportuna cella della tabella...

Il risultato lo puoi vedere qui: http://www.thepinkbox.it/lyrics.asp?...104&idalbum=12

Cmq grazie mille lo stesso...

Discussione: Eliminare scrollbar orizzontale in un tbody con gestione dell'overflow

Strumenti discussione

Ricerca discussione

Visualizza

Eliminare scrollbar orizzontale in un tbody con gestione dell'overflow

Permessi di invio