Linéariser un tableau HTML via css ?

[yobiwan]

Petite question :

Je créer un tableau de données et j'aimerais en proposer une version linéaire.

Est ce possible via CSS ?

en gros les td seraient les uns en dessous des autres plutot que les uns à coté de des autres.

Merci de votre aide.

[Fruge]

Bonsoir,

Il me semble qu'un "display: block" devrait convenir :

tr {display: block; }

Fruge.

[yobiwan]

Semblerait que ca ne marche pas.

[Monique]

Bonjour yobiwan,

Effectivement, j'ai fait quelques essais aussi... sans succès.

En fait, je dois avouer que je ne comprends pas bien ce que tu veux faire

J'ai cherché des informations à propos de l'accessibilité des tableaux.

Je n'ai rien trouvé qui semblerait correspondre à ton souhait.

La notion "linéaire" apparaît dans les spécifications mais il s'agit de l'organisation de la structure des tableaux en identifiant les groupes de lignes et/ou de colonnes (thead, tfood, tbody, colgroup...).

Et, en prévision de l'évolution des navigateurs :

Nommez les éléments du tableau avec les attributs "scope", "headers", et "axis" ainsi les navigateurs futurs et les technologies de support seront capables de sélectionner les données à partir d'un tableau en filtrant sur les catégories. Ce balisage aidera également les navigateurs à linéariser les tableaux (également appelé "serialisation" de tableau). Une version linéaire basée sur les lignes peut être créé en lisant l'entête de ligne, précédant alors chaque cellule avec l'entête de colonne de la cellule. Ou, la linéarisation peut être basée sur les colonnes. Notez que la direction d'écriture de la langue naturelle peut affecter la présentation des colonnes (et donc l'ordre). En HTML, l'attribut " dir" spécifie la présentation de l'ordre des colonnes (ex., dir="rtl" spécifie présentation de la droite vers la gauche).

Cette page, avec comme exemple l'utilisation d'un calendrier est très intéressante aussi.

[yobiwan]

Merci mais ca repond pas vraiment a ma question

En fait, j'aimerais proposer une vraie version linéaire d'un tableau.

Plus de stucture en tableau donc, mais en ligne.

Exemple :

table

tr

td

1ere colonne

/td

td

2eme colonne

/td

/table

deviendrait à l'affichage :

1ere colonne

2eme colonne

sans mise en forme de tableau

[Monique]

Merci mais ca repond pas vraiment a ma question 

Figure-toi que je m'en doutais...

Maintenant que je comprends ce que tu veux obtenir...

je ne comprends pas pourquoi tu veux utiliser un tableau

Selon le type et le volume des données, il me semble que l'utilisation de blocs (qui s'affichent par défaut, en flux normal, en une succession verticale), de listes (ul, dl) conviendrait pour cela.

[Fruge]

Semblerait que ca ne marche pas.

Ha bon ?

parce que j'avais fait un essai rapide avant de poster, et ca marchait... et tout cas, toutes les cellules etaient les unes en dessous des autres...

Fruge.

[Fruge]

Ralala, bon, j'avoue, c'est un peu de ma faute : j'ai tapé trop vite : le bon code est

td {display: block; }

( "td" et non "tr" )

(Exemple ici : -http://www.hist-geo.com/A.php )

Fruge

[yobiwan]

Pour ce qui est du choix de faire un tableau, c comme je le disais c'est un tableau de données qui nécessite des balises pour etre accessible donc pas le choix.

[yobiwan]

Ralala, bon, j'avoue, c'est un peu de ma faute : j'ai tapé trop vite : le bon code est

CODE 

td {display: block; }

( "td" et non "tr"  )

(Exemple ici : -http://www.hist-geo.com/A.php )

Fruge

Quand je vais sur le site, je ne vois pas la linearisation de l'info, j'ai toujours deux colonnes et deux lignes. Normal ?

[Monique]

Bonjour,

J'ai compris pourquoi mes essais n'étaient pas concluants : je travaille avec WebExpert et le mode prévualisation (et j'en été restée là) est basé sur le moteur de IE...

Ce code (extrait de ta page, Fruge) fonctionne avec Opera 7 et Firefox 0.8 mais pas avec IE 6

<table border="0" cellspacing="0" cellpadding="0">
    <tr>
   	 <td style="display:block">Colonne 1</td>
   	 <td style="display:block">Colonne 2</td>

    </tr>
    <tr>
   	 <td style="display:block">Cellule 1</td>
   	 <td style="display:block">Cellule 2</td>
    </tr>
 	 </table>

C'est le terme "linéarisation" qui me bloque un peu, yobiwan : tu sembles lui donner un sens contraire.

Il me semble que linéarisation signifie "mettre en ligne" (ce qui correspond à ce que je trouve dans les spécifications, les informations doivent être dans un ordre logique pour être lues comme une ligne).

Pour toi, il s'agit de les placer verticalement

[yobiwan]

Le souci reste que 90% des utilisteurs sont sous IE. Et que mettre 90 % des utilisateurs out pour une solution c pas trop faisable quand meme

[Fruge]

Quand je vais sur le site, je ne vois pas la linearisation de l'info, j'ai toujours deux colonnes et deux lignes. Normal ?

Ce code (extrait de ta page, Fruge) fonctionne avec Opera 7 et Firefox 0.8 mais pas avec IE 6

Salut,

Effectivement, je travaille avec Mozilla, et ca marche bien ; IE, je n'ai pas essayé, désolé !

Fruge.