info
Google Groups no longer supports new Usenet posts or subscriptions. Historical content remains viewable.
Dismiss
tbody coulissant
1 view
Skip to first unread message
Lea Gris
Nov 5, 2011, 10:11:36 PM11/5/11
to
Bonjour,
J'espérais naïvement pouvoir faire défiler la section tbody d'une table
à l'aide des CSS max-height et overflow:auto. Que nenni !
Ils pensent à quoi au W3C ? ;)
Comme cette évidence logique ne fonctionne malheureusement-pas. J'ai
fouillé un peu le web avec des solutions qui ne me satisfont pas
vraiment ou pas du tout.
Solution 1 :
mettre la tybody en display:block, mais dans ce cas les colonnes du
tbody ne sont plus alignées avec les colonnes des thead et tfoot ou il
faut fixer en dur la taille de chaque case du tableau ou encore définir
les tailles par sélecteurs de voisinages td + td + td {width:...} ...
Solution 2 (la moins pire):
encapsuler le tableau dans deux div (ça commence mal pour la sémantique)
forcer les thead et tfoot en position absolue et bricoler les paddings
de la section tbody pour qu'elle glisse entre les deux (indigeste)
Solution 3 :
utiliser javascript pour modifier les objets du DOM ;(
Solution 4 :
Demander de l'aide ici, si vous connaissez des solutions plus propres et
ou sans Javascript.
--
Lea Gris
J'espérais naïvement pouvoir faire défiler la section tbody d'une table
à l'aide des CSS max-height et overflow:auto. Que nenni !
Ils pensent à quoi au W3C ? ;)
Comme cette évidence logique ne fonctionne malheureusement-pas. J'ai
fouillé un peu le web avec des solutions qui ne me satisfont pas
vraiment ou pas du tout.
Solution 1 :
mettre la tybody en display:block, mais dans ce cas les colonnes du
tbody ne sont plus alignées avec les colonnes des thead et tfoot ou il
faut fixer en dur la taille de chaque case du tableau ou encore définir
les tailles par sélecteurs de voisinages td + td + td {width:...} ...
Solution 2 (la moins pire):
encapsuler le tableau dans deux div (ça commence mal pour la sémantique)
forcer les thead et tfoot en position absolue et bricoler les paddings
de la section tbody pour qu'elle glisse entre les deux (indigeste)
Solution 3 :
utiliser javascript pour modifier les objets du DOM ;(
Solution 4 :
Demander de l'aide ici, si vous connaissez des solutions plus propres et
ou sans Javascript.
--
Lea Gris
Pierre Goiffon
Nov 7, 2011, 4:01:14 AM11/7/11
to
Le 06/11/2011 03:11, Lea Gris a écrit :
> J'espérais naïvement pouvoir faire défiler la section tbody d'une table
> à l'aide des CSS max-height et overflow:auto. Que nenni !
> Ils pensent à quoi au W3C ? ;)
Nous avions été confronté au prb ici (comme tout le monde ou presque :)
> J'espérais naïvement pouvoir faire défiler la section tbody d'une table
> à l'aide des CSS max-height et overflow:auto. Que nenni !
> Ils pensent à quoi au W3C ? ;)
), c'est un peu loin dans ma mémoire et je n'ai pas retrouvé trace de ce
qui avait été fait à l'époque... De ce dont je me souviens le overflow
ne fonctionnait que sur certains navigateurs, et pour la majorité des
autres (IE :) ) il fallait passer par du JS.
A vous lire le overflow ne fonctionne pas du tout ??
En cherchant sur google "table fixed header" on trouve de très nombreux
résultats, et les premiers sont des solutions en JS...
Lea Gris
Nov 7, 2011, 6:19:46 AM11/7/11
to
Le 07/11/2011 10:01, Pierre Goiffon a écrit :
> En cherchant sur google "table fixed header" on trouve de très nombreux
> résultats, et les premiers sont des solutions en JS...
Je me suis rabattue sur une solution javascript avec
> En cherchant sur google "table fixed header" on trouve de très nombreux
> résultats, et les premiers sont des solutions en JS...
http://datatables.net/. Ce n'est pas si mal finalement. La table reste
telle que en html et se dégrade donc à sa présentation standard en
absence de javascript. Pour les navigateurs textuels, la sémantique est
préservée.
--
Lea Gris
0 new messages