tableau, largeur de cellule et class

Bonjour,

Dans ma page HTML, j'ai plusieurs tableaux, gérés pour les largeurs de colonnes en CSS par

Code:

---

1 2 3 4 5 6

TD{ width:20%; text-align: center; border: thin solid #0000FF; padding:10px; }

---

mais sur un autre tableau je souhaite une largeur différenrte, donc il faut créer une classe, j'écris :

en HTML :

Code:

---

<TD class=somm>

---

en CSS :

Code:

---

1 2 3

TD.somm{ width:1%; }

---

ça ne donne pas (comme on dit en Afrique)

j'écris en CSS

Code:

---

1 2 3

.somm{ width:1%; }

---

ça ne donne pas

j'essaie des tas de pitreries, résultats plus ou moins désordonnés

Alors je demande conseil, comment écrire ça ?

Je teste avec IE et FF

Merci

Bonjour,

Tu peux définir les classes de ton tableau et ensuite définir les CSS.

Exemple

CSS
.tableau1 td {propriétés}
.tableau2 td {propriétés}

HTML
<table class="tableau1"><tr><td>texte</td></tr>
</table>
<table class="tableau2"><tr><td>texte</td></table>

A toi de définir tes besoins.
A part cela, désolé je ne parles pas l'Africain ;) Quand tu dis "ça ne donne pas"tu veux dire que tu n'as pas de résultat ? Si oui, augmente ta valeur de 1px. Je dis cela car 1px n'es pas beaucoup :lol:
Bonne chance!
Niklaus

Merci,

Citation:

---

Envoyé par niklaus

A part cela, désolé je ne parles pas l'Africain ;) Quand tu dis "ça ne donne pas"tu veux dire que tu n'as pas de résultat ?

---

du coté de Mouana, ça signifie en clair "je n'obtiens pas les résultats escomptés" (version rue St Guillaume)

Citation:

---

Si oui, augmente ta valeur de 1px. Je dis cela car 1px n'es pas beaucoup :lol:
Bonne chance!
Niklaus

---

Non, je voudrais la dimension en %, question de résolution du visiteur

re,

je crois que j'ai trouvé :
la largeur du tableau est prioritaire / à la largeur des TD
Un tableau sans largeur, avec 20 TD à 1% = le tableau sur toute la largeur
Un tableau à 50% quelle que soit la largeur des TD (en %) prend la moitié de l'écran

CQFD

Si les dim sont indiquées en px, je ne sais rien du tout, mes affirmations ne sont valides qu'en %

Je vais continuer à travailler cet aspect et je reviendrai donner mes trouvailles

A+

re,
Dans la feuille HTML

Code:

---

1 2 3

<TD class=somm> OK <TD class="somm"> OK <TD.somm> NON

---

Dans la feuille CSS

Code:

---

1 2	TD.somm{instruction} OK .somm{instruction} OK

---

on peut (?) en conclure que HTML et CSS sont très tolérants

La question à se poser est maintenant :
quand la CSS déclare :

Code:

---

1 2 3 4 5

TABLE{ width=100%; margin-left: auto; margin-right: auto; }

---

c'est 100% de l'écran

quand TD déclare

Code:

---

1 2 3 4

.somm{ text-align: left; width:1%; }

---

1% de quoi ?
De toute façon cette commande n'est pas éxécutée, elle donne l'impression d'être "annulée" par la commande de TABLE

Ce point ne me semble ni très clair ni très précis

Si une pointure donnait un avis, ce serait sans doute utile

Merci

re,

après un "certain" nombre de tests, si la somme des TD fait 100% ça donne des résultats "acceptables" et cohérents.

Si le total des TD fait plus de 100%, les premiers TD sont OK, les derniers sont "bouffés"
Si le total fait moins de 100%, tout se passe comme si la commande CSS faisait 100%

Test avec IE et FF

Je crois que je peux marquer résolu, mais j'attends un peu, des fois qu'une pointure me contredirait

A+

Hello ;)
juste en passant, habituez vous à écrire les balises en minuscule, que ce soit au niveau des sélecteur de type dans la CSS qu'au niveau du (X)HTML.
Si vous êtes en doctype XTHML, cela invalide votre document.

re,

tout ce que j'ai écrit auparavant est invalide
En effet, j'ai fait les tests avec des cellules vides
Si les cellules sont pleines (obligeant à du multiligne) les instructions de largeur tant HTML que CSS, sont inopérantes, tant en % qu'en px

Il faut remarquer, d'ailleurs, que la propriété width ne concerne que les images dans les specs CSS (en tout cas les miennes)

Donc il faut attendre qu'un spécialiste nous dise comment fixer les dimensions d'un tableau et des cellules.

Après avoir cherché des solutions de rechange, je crois avoir trouvé : remplacer les tableaux par des DIV

La lutte continue... continuons le combat

Pour erwan31 : bien noté, plus de majuscules8O

A+

Pour commencer, il faut que vous soyez très vigilant sur la syntaxe CSS et HTML, celle-ci est d'autant plus importante que votre document est en mode de rendu standard (via la déclaration d'un doctype (DTD) valide et complet en haut du document).
Les valeurs d'attributs (class="...") sont toujours à mettre entre guillemets.

Pour les déclarations (propriété:valeur; ) CSS on écrit pas width=100%; mais width:100%, dans une balise HTML ouvrante on écrit en revanche width="100" c-a-d SANS l'unité.

Concernant le tableau de mise en forme, il faudrait nous dire ce qu'il doit contenir dans sa totalité pour savoir si c'est un choix pertinent.
Donner si possible la totalité du code (X)HTML et CSS ou alors une page en ligne.
Les DIV ne seront peut-être pas plus adapté.

D'une manière général TOUJOURS partir du contenu pour pouvoir déterminer quel sera le choix de balisage le plus approprié (p, ul, div...).