Alignement vertical d'un image dans une liste

**isaric** · 08/10/2019, 13h49

Bonjour,

J'utilise une liste avec une puce, une image et du texte (et un peu de CSS):

Qui ressemble à cela :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
<ul 	class="niveau2 blockFenetre"  >
	<li>
<a href=".....php" style="cursor:help" title="titre"> 
<img class="img" src="....jpg" title="titre"
 alt="Photo" />
Texte
 </a>
	</li>
   </ul>

J'aimerai avoir la puce en haut de l'image et non en bas.
Et le texte à droite mais au milieu de l'image et non en bas.

d'avance merci

Invité · 08/10/2019, 17h05

Bonjour,

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
.niveau2 li > a {
  display:inline-block;
  vertical-align:top;
}
.niveau2 li > a > img {
  vertical-align:middle;
}

**isaric** · 09/10/2019, 13h13

merci jreaux62 pour ta réponse

Je rajouté le code à ma page CSS et cela n'a rien changé

J'avais vu ce site : https://flexboxfroggy.com/#fr, mais je n'ai pas vraiment compris et si cela a avoir avec mon problème !

Invité · 09/10/2019, 14h13

Bonjour,

vu le site (que tu m'as envoyé en MP), je dirais que ce n'est pas bien grave...

Il date quand même de Mathusalem !

mise en page avec des <table> (ça ne se fait plus depuis le siècle dernier)
...

A ta place, je repartirais de zéro, pour le moderniser : design, "responsive",... (ce qui améliorera aussi le référencement)

Si la programmation n'est pas ton fort, tu peux te tourner vers WordPress.
C'est gratuit.