J'ai oublié...

Bonjour,

Bonjour, je voudrais faire une liste verticale de photos à gauche et le texte de présentation à droite.
Je peux y arriver avec un tableau 2 colonnes, mais je préfère le CSS...

Code HTML
<article>
<div class="candidats"><img src="img/dominique.jpg" alt="dominique" id="candidat"><h1> Dominique </h1></div>
<div class="candidats"><img src="img/jacques.jpg" alt="jacques" id="candidat"> <h1>Jacques </h1></div>
<div class="candidats"><img src="img/julie.jpg" alt="julie" id="candidat"><h1>julie </h1></div>
<div class="candidats"><img src="img/martine.jpg" alt="martine" id="candidat"><h1>martine</h1></div>
</article>

Code CSS
article
{
color:#80699F;
background:url(img/fond.bmp);
}
#candidat /*propriétés de la photo*/
{
width:150px;
height:150px;
margin-left:150px;
margin-right:50px;
margin-bottom:10px;
float:left;
}
.candidats h1
{
display:inline-block;
}
.candidats, h1
{
font-size:1.0em;
font-style:'comic sans ms';
}


Je bloque ici...

La deuxième photo ne se place pas sous la première mais à 200px à droite, sous le texte de <h1>