Slider (carrousel) html css
Bonjour,
Je souhaite faire un slider, les images sont générer via du php sous la forme:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| <div class="slider">
<ul>
<marquee width="100%" style="white-space: nowrap;">
<li id="slider_news-42">
<div class="desc_news">
<div class="img_news">
<img src="img/slider/icone39.jpg" alt="">
</div>
</div>
</li>
<li id="slider_news-32">
<div class="desc_news">
<div class="img_news">
<img src="img/slider/icone4.jpg" alt="">
</div>
</div>
</li>
[...]
</marquee>
</ul>
</div> |
Voici le rendu: http://s3.noelshack.com/old/up/img-dee5724431.png
Mon problème est que les 4 ère images se charge au bon endroit mais que les autres se mettent l'une en dessous de l'autre.
Voila une partie du css:
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
| .slider_news ul{
position:relative;
height:140px;
margin:0;
padding:0 0 0 10px;
list-style-type:none;
z-index:1;
overflow:hidden;}
.slider_news li{
float:left;
display:inline;
width:175px;
height:140px;
margin:0;
padding:5px 0;
overflow:hidden;}
.slider_news div{
margin:0;
padding:0;}
.slider_news img{
border:1px solid white;
filter:alpha(opacity=90);
width:130px;
height:130px;}
.slider_news .desc_news .contain_news{
width:175px;
text-align:justify;} |
Si vous voyez ce qu'il faut faire pour coller les images, je suis tout ouïe.
Merci d'avance.
EDIT: J'ai mis une version en ligne pour que vous puissiez voir le bug: http://lti.eu/index_test.php
