"caption-side" avec Google CHR

Bonjour,

Impossible de faire fonctionner "caption-side" et "vertical-align" !
Aucun effet !

Est-ce que ça vient de mon navigateur "Chrome"?
En cherchant sur internet, je n'ai pour autant pas recensé d'incompatibilité avec ces propriétés et Chrome!

Donc je sèche là ...

Auriez-vous une idée?

Merci !
Modifié par Claw69 (26 Oct 2010 - 14:09)

Bonjour,

On est bien d'accord que ces propriétés sont appliquées à des éléments de tableau ?

Bonjour Laurie-Anne,

oui tout à fait, pour un tableau, aucun effet chez moi...

en fait pour "caption-side", 'top' et 'bottom' fonctionnent mais 'right' ou 'left' 'y a pas moyen, le titre se met en 'top'.

AUTANT POUR MOI: VERTICAL-ALIGN marche bien correctement !
Modifié par Claw69 (26 Oct 2010 - 14:09)

Pour aligner le caption à droite, utilises plutôt text-align:right en CSS sur l'élément caption.

Merci Tony Monast mais mon titre reste pour autant en "top", il est juste désormais aligné en haut à droite de mon tableau (au-dessus de la colonne la plus à droite) et pas à droite de mon tableau c'est-à-dire à droite des colonnes les + à droite ....comme est censé le faire un caption-side ...

le mystère reste donc entier pour moi ....
Modifié par Claw69 (26 Oct 2010 - 16:10)

D'après le W3C, en CSS2, caption-side supporte seulement top et bottom. Où as-tu vu que tu pouvais utiliser left et right avec caption-side? En CSS3?

Peux-tu nous fournir un aperçu du résultat que tu souhaites obtenir?

en fait je suis en train de suivre un tuto HTML/CSS et il parlait des possibilités de "caption-side" (left, top, bottom, right) c'est pour ça que j'ai fait des tests et que j'ai constaté le "problème".

Pour la version CSS, comment fait-on pour savoir laquelle on utilise ?
Parce qu'on utilise des propriétés qui dépendent de telle ou telle version c'est ça ?

J'vous avais dit que j'étais pas un cador encore !

C'est que CSS 2 est plutôt bien supporté par les navigateurs actuels, et CSS 3 ne l'est pas encore tout à fait. Tu peux jeter un oeil au site du W3C pour les différentes versions de CSS et ce qui est supporté ou pas : http://www.w3.org

À noter que le site du w3c est loin d'être sexy...

As-tu l'adresse du tuto en question? J'imagine qu'il doit préciser que c'est du CSS3?

Est-ce que ton caption-side:right fonctionne sur Firefox et IE8 par exemple?
Modifié par Tony Monast (26 Oct 2010 - 17:08)

ok j'ai noté pour le W3C..merci

Sinon, non dans le tuto il ne fait pas allusion à une version de CSS.
En fait je sais pas trop si je peux filer ici le lien d'un site concurrent ... remarque je pense qu'en te disant ça, tu dois savoir duquel il s'agit...

non pas testé avec un autre navigateur.

Tu m'avais demandé un exemple : je pense que "caption-side: right" est censé réagir comme ci-dessous mais finalement p-e que je me trompe.

TABLEAUTABLEAU
TABLEAUTABLEAU
TABLEAUTABLEAU TITRE TABLEAU
TABLEAUTABLEAU
TABLEAUTABLEAU
Modifié par Claw69 (26 Oct 2010 - 17:15)

Pas de problème, tu peux poster l'adresse du tuto ici.

ok , voilà :
lien tuto tableaux

regardes tout en bas pratiquement, "Quelques nouvelles propriétés CSS", avant le QCM, titre

left et right pour caption-side est du CSS3 :

w3c a écrit :
This algorithm follows the CSS 2.1 specification of the caption-side property, where the only possible values are top, bottom and inherit. CSS 3 will also add left and right.

Ça fonctionne dans Firefox, mais pas dans Chrome ou IE7.

À mon avis, il serait plus sage d'utiliser une autre solution pour positionner le titre à droite du tableau (float par exemple). CSS3 c'est bien joli, mais ce n'est ni officiel ni supporté partout.

ça marche merci Tony pour tes recherches et ton aide.

Et merci pour le tuyau du "float" !

j'vais essayer d'étudier les différentes versions CSS, les officielles et les non-officielles, etc...
J'ai encore du boulot moi...