Discussion :

[esox_13]

Bonjour,

J'ai la chose suivante à faire qui est très simple avec un tableau mais j'aimerais savoir si on peut le faire sans tableau : je voudrais aligner deux images côte à côte sans utiliser de tableau.

Code html :

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

1
2
<img title="texte_accueil" src="images/titre_site.png" alt="Jean-Martin Barbut Photographies haute et très haute résolution" />
<img title="image_accueil" src="images/image_accueil.jpg" alt="Buste femme" id="image_accueil">

Ce code fonctionne mais si je réduis la largeur du navigateur web une image passe sous l'autre. JE voudrais donc faire cela sans utiliser de tableau :

http://photo.jeanmartinbarbut.fr/web/home.html

Merci !

[Candygirl]

Hello,

Si tu veux les forcer à rester côtes à côtes, tu peux le gérer de différentes manières. Par exemple:

• en utilisant un white-space:nowrap sur le parent (mais pas en float)
• en attribuant un min-with au parent, assez large pour contenir les deux côte à côte
• en utilisant des display:table-cell

...

Par exemple:

Code html :

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

1
2
3
4
 
<div>
<img src="images/titre_site.png" alt="Jean-Martin Barbut Photographies haute et très haute résolution"><img src="images/image_accueil.jpg" alt="Buste femme" id="image_accueil">
</div>

Code css :

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

1
2
3
4
5
6
7
8
div {
  text-align:center;
  white-space:nowrap;
}
 
img {
  vertical-align:middle;
}

[esox_13]

Merci, Candygirl, en fait on s'est croisés dans une autre boutique, merci pour ton aide.