28173 sujets

CSS et mise en forme, CSS3

Bonjour tout le monde et joyeuses fêtes de fin d'année.

Je reviens vers vous pour poser une question, qui j'espère, ne sera pas une colle comme la dernière fois Smiley sweatdrop (moi et mes idées impossible)

Voilà, j'essais depuis un sacré bout de temps d'afficher des photos dans un bloc de taille vertical fixe et avec un scroll horizontal qui file hors de la page.

Un truc du genre :
http://img328.imageshack.us/img328/8858/devhorizontalfo1.jpg

<div id="scolling">
	<img src="./photos/01.jpg" alt="01" />
	<img src="./photos/02.jpg" alt="02" />
	<img src="./photos/03.jpg" alt="03" />
	<img src="./photos/04.jpg" alt="04" />
	<img src="./photos/05.jpg" alt="05" />
</div>


J'ai tout essayer, overflow, float, display, dans des div, dans des ul/li... Rien y fait.

Seul deux solutions qui ne me vont absolument pas permettent de le faire.

La première est de fixer la taille horizontal du div, impossible, les images sont chargé par un script php et le nombre d'image affiché est très variable (et je me vois mal faire un calcul en php de la somme des pixel horizontal des photos, c'est trop de temps machine pour rien).

L'autre solution, c'est le iframe, et tant qu'a vomir, je préfère que ce soit après une bonne crise de foie (au moins, j'aurais bien mangé). :lol:

Alors, vous sauriez me trouver une pistounette ? aller quoi, c'est Noël ! Smiley ravi
Modifié par MrSoul (29 May 2013 - 15:00)
Salut !

J'ai jamais essayé de faire ce genre de mise en page, mais si tu mets white-space : nowrap; sur ton div ca ne fonctionne pas ?
Bonjour MrSoul,

Peut être que cela correspond à ton besoin ?
<div style=
"width: 730px;height: 420px;overflow: auto;border :solid 2px #008;background-color: #000;white-space: nowrap;">
<img src="image1.jpg" width="500" height="380" alt="" title="" /><img src=
"image2.jpg" width="500" height="380" alt="" title="" /><img src="image3.jpg"
width="500" height="380" alt="" title="" /></div>

Modifié par papillon41 (26 Dec 2006 - 09:21)