Discussion :

[kate59]

Bonjour

voila mon diaporama n'est pas a 100% des grands ecran alors que j'ai mis 100% pour les img et les div.

Sur le moyens et petits pas de soucis.

Code html :

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

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
32
<div class="slider-relative">
   <div class="slider-block">
     <div class="slider">
       <ul class="items">
         <li><img src="images/slide.jpg" alt="" style="width:100%;" />
 
         <div class="banner" style="margin-right:10px;padding-left:10px;padding-right:20px;">
         <span style="width:100%;top:200px;color:#fff;z-index:15;background:url(../images/png.png) left top repeat;">
         Bienvenue sur notre site du Domaine de La Carrière : Chambre d’hôtes de charme...
         </span>
         </div></li>
 
        <li><img src="images/slide.jpg" alt="" style="width:100%;" />
 
         <div class="banner" style="margin-right:10px;padding-left:10px;padding-right:20px;">
         <span style="width:100%;top:200px;color:#fff;z-index:15;background:url(../images/png.png) left top repeat;">
         Le mas la Carrière vous accueille dans son domaine, entre Garrigues et Méditerannée, au coeur des Cévennes du Sud.
         </span>
         </div></li>
 
 
        <li><img src="images/slide2.jpg" alt="" style="width:100%;" />
 
         <div class="banner" style="margin-right:10px;padding-left:10px;padding-right:20px;">
         <span style="width:100%;top:200px;color:#fff;z-index:15;background:url(../images/png.png) left top repeat;">
         Vous apprécierez le charme et la serenité de cette belle demeure batie en 1839. ...
         </span>
         </div></li>
       </ul>
     </div>
   </div>
</div>

le css :

Code :

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

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
32
33
34
35
36
37
/*Slider*/
.slider-relative {
    /*position:relative;*/
    z-index:1000;
    /*overflow:hidden;*/
    margin: 0 auto;
    height: 625px;
    position: absolute;
    width:100%;
 
}
 
 
.items {
    display: none; 
    width: 100%;
}
 
.slider-block {
    position:relative;
    overflow:hidden;
    height: 625px;
    margin: 0 auto;
    width: 100%;
}
.slider {
    z-index:2;
    height: 625px;
    position: absolute;
    left: 50%;
    margin-left: -800px;
    min-width: 1600px;
}
 
.slider img{
width: 100%;
}

merci

[Invité]

Bonjour,

D'après ce que j'ai vu :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.slider {
    height: 625px;
    /*left: 50%;*//* SUPPRIMER */
    /*margin-left: -800px;*//* SUPPRIMER */
    /*min-width: 1600px;*//* SUPPRIMER */
    position: absolute;
    width: 100%;/* AJOUTER */
    z-index: 2;
}
 
.items {
    margin: 0;
    padding: 0; /* la balise ul a un padding-left par défaut */
    width: 100%;
}

Sinon, as-tu une page en ligne ?