Bonjour,

Voila je rencontre un petit problème avec mon code.

Ce que je fais

Je tente de créer une jolie table en css/html et voilà ce que j'ai fait pour l'instant : https://jsfiddle.net/mrg0szzt/

Ce que je veux

Je souhaite que le body de la table (nommé tbody) soit scollable indépendemment du thead (thead = header de la table) de la table

Ce que j'obtiens

Donc voici les deux possibilités :
-si je mets '''display:block''' sur le tbody j'ai toutes les données compressée dans une même colonne...
-Si je mets "display:table-header-group;" le " overflow-y: auto;" cesse de fonctionner

J'ai essayé de faire avec deux tables : https://jsfiddle.net/mrg0szzt/6/
Un problème persiste : le tbody et le thead ne sont pas alignés

3 réponses


Asmista
Réponse acceptée

Ok j'ai compris ton soucis, mais du coup tu sais que le datatable fait exactement ce que tu veux de base ?

https://datatables.net/manual/styling/bootstrap

J'ai déjaà fait des tableaux comme tu aimerais avec ça.

Bonjour a toi, de ce que je vois sur ton lien c'est déjà le cas en faite qu'est ce qui ne vas pas ici ?

https://jsfiddle.net/v2yyxzcz/

swad
Auteur

Merci d'avoir pris le temps de répondre.
En fait dans le cas où le body est scrollale (https://jsfiddle.net/v2yyxzcz/), toutes les colonnes du body se tassent dans la colonne du Field 1....
Les colonnes Field 2, 3, 4 et 5 sont alors vides