Bonjour,

J'essaye de mettre 2 images en div id l'une a côté de l'autre, mais elles se mettent l'une en dessous de l'autre ...
Pouvez-vous m'aider ?
Voici les codes :

<center>

<div id="cadres_photos">

<img src="Images/Bretagne.jpg">

</div>
<div id="cadres_photos">

<img src="Images/Bretagne.jpg">

</div>

<br /> <br /> <br /> <br />

<br /> <br /> <br /> <br />


</center>

#cadres_photos
{
border: 2px solid darkgrey;
width: 12%

}

Merci d'avance,
Cordialement !

déjà, tu ne peut pas mettre deux élément avec le même id dans la même page !

<center>
<div class="cadres_photos">
  <img src="Images/Bretagne.jpg">
</div>
<div class="cadres_photos">
  <img src="Images/Bretagne.jpg">
</div>
</center>

esuite essaye ça :

.cadres_photos
{
border: 2px solid darkgrey;
float: left;
width: 12%
}

Merci Mais maintenant comment faire pour que mes deux images soit au milieux de la page ? elle est restent à gauche meme si maintenant elle sont accolées. Pourtant j'ai bien la balise center ...

essaie textalign pour une div qui contient les 2 images. Je ne pense pas que ca s'applique que pour le texte

salut!
tu peux affecter pour chaque div un "id" dans
lesquels tu met le premier en position absolute
au milieu de la page legeremment à gauche, et le deuxieme en position relative par rapport au premier legeremment
à droite de façon à ce qu'ils soient en plein
milieu de ta page les deux!

Bonjour,

rien ne marche,
Avez-vous d'autres solutions ?
Merci .

Salut,

Pour centrer tes images, essaye de faire une div qui englobe les 2 images et mets lui un "text-align:center;".

Si ça ne marche toujours pas, mets une largeur fixe à div qui englobe tes images (la taille de tes 2 images + la marge qui les séparent par exemple), puis ensuite met un "margin:auto;".

EDIT: ta aussi une troisième méthode, qui est un peu bourrin, c'est de mettre la div qui contient tes images en "position:absolute" en "left:50%" et ensuite, il faut que tu retranche la moitié de la largeur de tes images pour le centrer par rapport au milieu et non au coté. Ca donne ce genre de truc :

#global { 
  position:absolute; 
  left: 50%;  
  top: 50%; 
  width: 700px; 
  height: 400px; 
  margin-top: -200px; /* moitié de la hauteur */ 
  margin-left: -350px; /* moitié de la largeur */ 
  border: 1px solid #000; 
}

En fait, je te conseil de lire ça : http://www.alsacreations.com/article/l [...] b-en-CSS.html

Comment ça une largeur fixe ? je fais comment ?

<div id="conteneur">

<div id="cadres_photos">
<img src="Images/Bretagne.jpg">
</div>
<div id="cadres_photos">
<img src="Images/Bretagne.jpg">
</div>

</div>

En CSS :

#conteneur
{
width:700px; 
margin:auto;
}

Si tu ne peux pas donner de largeur fixe, remplace le "margin:auto;" par "text-align:center;" et enlève le "width". Normalement, les 2 méthodes devraient fonctionné, bien qu'avec les float il y a toujours des petits soucis ...

Les deux images se superposent vers la moitié, comment faire ?

EDIT: non c'est bon , ça ne se superpose plus , mais en fait elles ne sont pas vraiment au milieu .... J'ai agrandi le width a 1500 px sinon ça se superpose

Bah, remplace dans le CSS la valeur de width:700px; par une valeur plus adapté. Si tes 2 images fond 200px et 100px, tu peux mettre un width a 310px pour laisser une marge de 10 entre tes 2 images.

EDIT: non c'est bon , ça ne se superpose plus , mais en fait elles ne sont pas vraiment au milieu .... J'ai agrandi le width a 1500 px sinon ça se superpose
Comment faire pour que ce soit vraiment au milieu ??

Citation : perok68

Bonjour,

rien ne marche,
Avez-vous d'autres solutions ?
Merci .

ma solution marche parfaitemment si tu fait correctemment les positionnements
mais les 2 div ne doivent pas etre contenues dans une
quelconque autre div