Et les tableaux alors ?

Hello,
Avant de faire enfler la polémique, je veux bien sur parler des "vrais tableaux".
Et oui, certaines informations ont besoin d'être compilées dans un tableau, du type tableau de comparaison. Et là, mon infographiste m'a gatée : coins arrondis de chaque coté, en haut, en bas ; bachground th différents...
J'aimerai donc savoir comment le faire au mieux : en respectant les standard, en evitant au maximum les exceptions, en assurant la compatibilité.
Connaissez-vous les meilleures solutions ?
Je peux donner un exemple graphique, mais je souhaite plutôt recueiilir des généralités.
PAr avance, merci pour votre aide.

réponse générique : bah en stylant les différents éléments des tableaux...

Pour les bg différents, par exemple, utilise des classes.

Tout dépendra de ton code et du design à réaliser.

Habillage de tableaux avec des CSS

À adapter

Quelques exemples ici également

Cdt,
Sylvain

Salut,

Il faut arrêter de chercher des complications là où il n'y en a pas.
Quand un tableau est nécessaire, il faut utiliser un tableau, c'est tout.

Les tableaux font partie des standards au même titre que les autres éléments HTML autorisés.
Il suffit juste de les employer à bon escient
Modifié par Ericf (18 Feb 2009 - 13:58)

Ericf a écrit :
Salut,

Il faut arrêter de chercher des complications là où il n'y en a pas.
Quand un tableau est nécessaire, il faut utiliser un tableau, c'est tout.
Les tableaux font partie des standards au même titre que les autres éléments HTML autorisés.
Il suffit juste de les employer à bon escient

Je ne comprends pas très bien le sens de ton intervention
Personne ne dit autre chose me semble t-il
Les conseils donnés s'appliquent à proposer des solutions pour habiller ces tableaux (des vrais avec des colonnes, des cellules, des entêtes, et tout et tout...) via css et parfois une surcouche javascript, rien d'autre...

Ai-je dit que les conseils étaient mauvais ?
Je n'ai fait que répondre à nell qui avait peur de "faire enfler la polémique" en parlant de tableaux...

Ericf a écrit :
Ai-je dit que les conseils étaient mauvais ?
Je n'ai fait que répondre à nell qui avait peur de "faire enfler la polémique" en parlant de tableaux...

Daccodac, mes confuses pour la confuse

Merci à tous pour vos réponses et vos exemples,
Pour tout vous dire, j'avais déjà identifié les liens que vous m'avez donné (désolée, j'aurais peut-être du le préciser) et même si cela est plutôt pertinent cela ne me fait pas vraiment avancé.
J'ai par exemple besoin de savoir :
comment réagissent exactement les tbody / thead / tfoot (multiplication du background image sous IE) ou caption
et puis mince, puisque c'est mon problème du moment, comment faire un tableau (de largeur fixe) avec les coins arrondis ?
Je peux, bien évidement, mettre des classes mais je préfère éviter les exceptions car ce tableau est déclinable et le site intégré à un CMS...
A votre avis, dois-je en passer par là ?
Ciao !

Tout dépends si le tableau à une largeur fixe ou non.

Mais dans les deux cas, il faudra utiliser des class spécifiques.

Tu peux également imbriquer le tableau dans un/des div pour appliquer les arrondis, mais ça risque d'alourdir le code.

Merci Laurie-Anne, j'en suis à la même conclusion...

Hello,

Les seuls éléments stylables de manière fiables sont TABLE, TH et TD. Ne pas donner de styles (fonds, bordures...) aux TR, si ce n'est peut-être des propriétés pour la mise en forme du texte qui passeront plutôt bien avec les différents navigateurs.

À priori, ne pas chercher à styler les THEAD, TBODY et TFOOT, ça ne passera pas mieux que les TR (c'est-à-dire que certains navigateurs s'en sortiront, d'autres non).

Cela ne signifie pas qu'on ne puisse pas utiliser ces éléments, ou une classe placée sur un TR, dans un sélecteur CSS.

Enfin bref, donc pour l'essentiel on passe par des classes, parce qu'IE6 ne supporte pas les sélecteurs du type table.special tbody > tr:first-child + tr > :first-child {...}, et aussi parce que c'est plus souple, ça permet de recomposer les mises en valeur graphiques en déplaçant les classes sur tel ou tel élément du tableau.

La principale difficulté, c'est qu'il n'y a pas de structure de colonne dans les tableaux HTML. (Edit: en fait si, il y en a une. Honte sur moi.) Les cellules sont dans des lignes et des colonnes, mais au niveau de l'arborescende HTML ils sont uniquement dans des lignes, et pour attribuer un style à une colonne il faudra donner une même classe non pas à la colonne (elle n'existe pas dans le HTML...) mais à toutes les cellules qui constituent la colonne. Et ça c'est assez rébarbatif. (Edit: donc une classe sur un COL ou COLGROUP qui va bien, et ça devrait aller.)

Par ailleurs, il peut être utile de savoir manipuler le mode de rendu par défaut des tableaux, et le mode de rendu fixe (table-layout:fixed), ce dernier étant plus limité mais aussi plus contrôlable.

Pour finir, je donnerais bien un exemple de tableau avec styles complexes, mais les deux-trois que j'ai eu l'occasion d'intégrer ces derniers mois (dont un pas mal complexe) font partie de projets pro, et sont confidentiels.
Modifié par Florent V. (18 Feb 2009 - 23:44)

Hello aussi,

Florent V. a écrit :
La principale difficulté, c'est qu'il n'y a pas de structure de colonne dans les tableaux HTML. Les cellules sont dans des lignes et des colonnes, mais au niveau de l'arborescende HTML ils sont uniquement dans des lignes, et pour attribuer un style à une colonne il faudra donner une même classe non pas à la colonne (elle n'existe pas dans le HTML...)

On peut utiliser dans une certaine mesure les éléments col et colgroup auxquels on peut appliquer des identifiants ou des classes qui se répercuteront sur les cellules de ces colonnes.
Voir les Les regroupements de colonnes.

Arf, honte sur moi, je me suis planté dans les grandes largeurs. Je pensais à tort que le support de COL et COLGROUP par les navigateurs était très mauvais, mais apparemment il n'en est rien.

Pour une info peut-être plus lisible que la spécification HTML, et des infos sur la compatibilité, on peut lire les pages des éléments COL et COLGROUP dans la référence HTML de SitePoint. C'est malheureusement en anglais seulement:

http://reference.sitepoint.com/html/col
http://reference.sitepoint.com/html/colgroup

Woaw, on peut même centrer le texte avec un alignement sur un caractère…

À ben là je ne savais pas du tout qu'on pouvait faire ça, c'est super pratique pour faire des alignements sur la décimale comme dans les tableurs, faudrait que je fasse des tests…

Merci Ericf (et Florent)

Edit :

a écrit :
This attribute is poorly supported and should not be relied upon.

Zut
Modifié par Patidou (19 Feb 2009 - 00:36)

Yes, merci à tous,
Je vais étudier ça dans le détail mais déjà je comprends mieux.
A bientôt