28172 sujets

CSS et mise en forme, CSS3

Bonsoir à tous,
je vous sollicite car je viens de soumettre mon projet actuel au Validator et je n'ai qu'une erreur que je ne parviens pas à résoudre. Il s'agit d'aligner sur la même ligne (middle) une image avec le texte dans un élément de liste.
Pour exemple, voici mon code actuel:

<ul style="margin-left: 0px; margin-top: 0px; padding-left: 0px;">
<li><a href="#"><img src="img/thumb.png" alt="" align="absmiddle"/> Texte A</a></li>
<li><a href="#"><img src="img/thumb.png" alt="" align="absmiddle"/> Texte B</a></li>
</ul>

Et donc, cette propriété n'est pas valide W3C: align="absmiddle"
J'ai essayé avec vertical-align:middle dans ma CSS mais il ne se passe jamais rien. Malgré mes recherches, je bloque sur ce tout petit bout de code...
Merci d'avance pour vos renseignements Smiley biggrin
Modifié par BloodyM (29 Sep 2010 - 23:02)
Modérateur
Bonsoir,

Regarde du côté de vertical-align en CSS. Par contre, je n'ai pas testé si ça fonctionne dans ton cas, mais j'ose croire que si.

À noter que si ces images sont décoratives, tu pourrais en faire des puces pour la liste.
Modifié par Tony Monast (29 Sep 2010 - 22:53)
Bonsoir, merci de ta réponse rapide mais en fait je me suis trompé dans mon message. Je viens d'éditer en précisant que vertical-align:middle n'y faisait rien Smiley cligne
Modérateur
D'accord. Sinon, il y a une raison de mettre ces images dans le contenu, plutôt qu'en puce ou en background?

Parce que comme dit plus haut, si c'est décoratif, vaudrait mieux utiliser les puces de la liste ou les mettre en background. Ça pourrait du même coup régler ton problème.
Bonjour

Et style="vertical-align:middle;" est-ce que ce serait valide ?
Modifié par thelma (29 Sep 2010 - 23:00)
Thelma a trouvé la bonne réponse. Smiley ravi
Merci à vous deux pour votre coup de pouce très rapide!

Et si quelqu'un tombe là dessus depuis Google, je précise que ce n'est pas dans un but décoratif mais il s'agit bien de contenu.

Encore merci, bonne soirée.

EDIT: @Tony Monast
J'ai fait une class img et ça passe nickel Smiley cligne
Modifié par BloodyM (29 Sep 2010 - 23:04)
Modérateur
Oui, ce serait valide, mais vaut mieux le déclarer directement dans la feuille de style. Mais selon BloodyM, vertical-align ne fonctionne pas dans son cas. Je suis en train de faire quelques tests.
Modérateur
BloodyM a écrit :
Thelma a trouvé la bonne réponse.


Mais tu venais juste de dire que vertical-align:middle ne fonctionnait pas dans ton CSS... Ça devrait tout autant fonctionner dans la feuille de style. J'imagine que tu t'étais trompé dans ton sélecteur CSS. Smiley ohwell

En plus, ce n'est pas comme si je n'avais pas donné cette réponse dès le départ... Smiley confuse
Modifié par Tony Monast (29 Sep 2010 - 23:05)
Oui tiens, c'est con mon truc. effectivement ça passait pas... et là... heu... peut-être une erreur dans ma class... je sais pas. lol
L'important est que ça fonctionne désormais Smiley confused
Ça devrait pourtant fonctionner aussi dans le css... Smiley ohwell

edit : Smiley biggol Pardon pour les télescopages de posts
Modifié par thelma (29 Sep 2010 - 23:08)