28220 sujets

CSS et mise en forme, CSS3

Comment fait on le plus simplement un tableau de 10 cases par 10 cases en CSS ?

J'ai peur de construire ce tableau de manière un peu compliqué :

Doit-on construire ce tableau ligne par ligne :

- en créant un bloc (div class) pour chaque ligne
- puis dans chaque ligne (chaque bloc) aligner différents blocs (div class)

quelle est la meilleure manière de procéder ?

Merci pour celui ou celle qui me répodra.

Sab.
Modérateur
Je me trompe peut-être, mais j'ai l'impression que tu pense que les tableaux sont à éviter absolument. Quelles genres de données veux-tu présenter ? Si c'est des données en lignes et colonnes, il FAUT utiliser un tableau.

Les tableaux doivent être utilisés pour présenter des données tabulaires, à la Excel par exemple. Les tableaux sont à éviter pour la mise en page, c'est tout. Smiley cligne
Pourtant il est bien preciser dans les cours d'alsacreations que la balise table est une balise obsolète qui va tendre à disparaitre dans l'avenir. Je sais tout le monde construit ses sites avec des tables...

Bref faire un tableau le plus simple possible en CSS alors ?
Administrateur
sabine a écrit :
Pourtant il est bien preciser dans les cours d'alsacreations que la balise table est une balise obsolète qui va tendre à disparaitre dans l'avenir.

Tu as mal lu Smiley cligne
- les tableaux pour la mise en page sont déconseillés et à éviter
- les tableaux pour les données tabulaires sont bien évidemment tout à fait appropriés Smiley smile

La balise <table> n'est pas obsolète et ne va pas disparaître (en tout cas j'espère que je n'ai pas écrit ce genre de bêtises sur Alsa), ne t'inquiète pas. Il faut juste changer un peu ses habitudes quant à son emploi pour les mises en page.
Modifié par Raphael (03 May 2005 - 18:13)
Modérateur
sabine a écrit :

Pourtant il est bien preciser dans les cours d'alsacreations que la balise table est une balise obsolète qui va tendre à disparaitre dans l'avenir.


C'est faux et j'aimerais bien que tu me montre l'endroit où Alsacreations en fait mention. Ce qui est obsolète, c'est de créer des interfaces en tableaux imbriqués.

sabine a écrit :

Je sais tout le monde construit ses sites avec des tables...


Eh non, pas tout à fait. La majorité ici ne construit par leurs sites en tableaux. Par contre, la même majorité utilise les tableaux pour présenter des données tabulaires, sous forme de lignes et colonnes lorsque cela est justifié.
En fait je suis pas sur :

ce que je veux présenter sur une page sont des listes de liens (pour un plan de site) bien rangés en catégories et sous catégories : utilisez les tables c'est toujours ok ?
sabine a écrit :
En fait je suis pas sur :

ce que je veux présenter sur une page sont des listes de liens (pour un plan de site) bien rangés en catégories et sous catégories : utilisez les tables c'est toujours ok ?


La réponse est dans ta question en fait si tu veux faire des alors tu as par exemple



<h1>Plan du site</h1>

<h2>Rubrique 1</h2>
<ul>
<li>Lien 1.1</li>
<li>Lien 1.2</li>
<li>Lien 1.3</li>
</ul>

<h2>Rubrique 2</h2>
<ul>
<li>Lien 2.1</li>
<li>Lien 2.2</li>
<li>Lien 2.3</li>
</ul>

<h2>Rubrique 3</h2>
etc...


Pour le positionnement il faut voir du coté des css
Ok mais si je veux que la rubrique 3 ne soit pas en dessous de la rubrique 2
et la rubrique 2 pas en dessous de la rubrique 1

mais :

les 3 rubriques alignées à l'horizontal (mais pas à la vertical)

Il me faut une table

(en tout cas merci pour vos réponses rapides : super ce forum css)
Modérateur
Il ne te faut pas forcément une table. Tu peux utiliser la positionnement flottant. Mon heure de dîner est terminée, je ne peux pas rester plus longtemps, mais les autres pourront t'aider. Smiley cligne

Bonne journée à tous !
Bon une autre possibilité avec les listes de définition parce que ce sera plus simple.

html

<dl>
<dt>Rubrique 1</dt>
<dd>lien1.1</dd>
<dd>lien1.2</dd>
<dd>lien1.3</dd>
</dl>

... idem pour les autres rubriques ...




et css


dl {
float:left;
}


Pour éviter les mauvaises surprise il faudra peut être donner une hauteur à tes dl par


dl {
height:?em;/*Je te conseilles d'utiliser l'unité em pour ce cas*/
}

Modifié par clb56 (03 May 2005 - 19:05)
ok mais pourquoi quand j'aligne plusieurs dl à la suite, le premier est bon et les suivants sont décalés. Pas sur explorer mais sous mozilla ?

Pourquoi ?

Merci...
Qu'entends tu par décalé ?
T'as un exemple en ligne qu'on puisse se rendre compte de quoi tu parles ?