Discussion :

[guy2004]

Bonjour,
Je cherche a faire une suite d'images en 1 ligne sans retour à la ligne, comment dois-je m'y prendre ?
Merci

[Auteur]

bonjour,

par exemple tu peux encadrer tes images des balises <nobr></nobr>

Code :

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

1
2
3
4
5
6
7
8
 
<nobr>
<img src="image1.gif">
<img src="image2.gif">
<img src="image3.gif">
<img src="image4.gif">
<img src="image5.gif">
</nobr>

par contre cette méthode ne tient pas compte de la taille de la fenêtre : une barre de défilement horizontale peut apparaître.

sinon encadrer chaque balise <img> par une balise <div> et appliquer le styles "float" et "position: absolute" sur le div

[guy2004]

Cela ne doit pas etre bon ce que je fais car cela ne donne rien :

Code :

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

1
2
3
div#1 {position:absolute; float:left;}
div#2 {position:absolute; float:left;}
div#3 {position:absolute; float:left;}

et le code HTML :

Code :

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

1
2
3
4
5
6
<div id="1"><img src="file:///C|/Program%20Files/EasyPHP1-8/www/dropmenu.gif" width="13" height="10">
drop menu </div>
<div id="2"><img src="file:///C|/Program%20Files/EasyPHP1-8/www/i.gif" width="173" height="98">
idpd</div>
<div id="3"><img src="file:///C|/Program%20Files/EasyPHP1-8/www/_off.gif" width="32" height="34">
ecrire</div>

[francis m]

supprimes tes divs (un div par image, ce n'est pas raisonnable)
et fais simplement

Code :

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

1
2
3
4
5
<p>
<img src="premiere image">
<img src="deuxième image">
<img src="troisième image">
</p>

et petite remarque : je suppose que tu as la ferme intention de ne JAMAIS mettre ton site en ligne ?

[Arnich]

Attention c'est pas bon de coller des div partout. Mais plutot des truc du type <img id="im1"> enuite dans ta feille css il faut mettre :
display : inligne;
Qui s'aplique sur les images que tu veux affiché allignée ainsi la balise img ne sera plus considérée comme un bloc

[francis m]

la balise img n'est pas un bloc, mais un inline
il n'est pas nécessaire de le préciser

[guy2004]

Pourquoi cette remarque francis m ?

[francis m]

pour répondre à Arnich

[guy2004]

bon ok j'ai fais avec la balise <p> et cela fonctionnne bien, mais ptite question si je veux un lien sous chaque image je dois refaire une ligne au dessous ?

[francis m]

ah si tu veux faire un lien sous chaque image tu es obligé de passer par le float:left, sinon ta présentation risque d'être nulle

exemple
css

Code :

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

1
2
3
4
5
6
7
8
9
.galerie_image
	{
	float: left; 
	margin: 5px;
	border: 1px solid #000000;
	text-align: center;
	height: 7.5em;
	width: 6em;
	}

html

Code :

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

1
2
<p class="galerie_image"><a href="lien1"><img src="image1.gif" ><br />blabla</a></p>
<p class="galerie_image"><a href="lien2"><img src="image2.gif" ><br />blabla</a></p>

[guy2004]

merci Francis M c'est ce que je cherchais à faire.
@+