Précédent   Forum des professionnels en informatique > Webmasters - Développement Web > CSS
CSS Forum d'entraide sur l'utilisation des feuilles de style CSS. Avant de poster : Cours CSS, FAQ CSS, Galerie CSS
Partagez cette discussion sur d'autres réseaux sociaux : Viadeo Twitter Google Facebook Digg Delicious MySpace Yahoo
Réponse Proposer ce sujet en actualité
 
Outils de la discussion
Publicité
'
Vieux 20/02/2011, 17h38   #1
Membre habitué
 
Denis Billo
Developpeur web et Access VBA
Inscription : janvier 2003
Messages : 282
Détails du profil
Informations personnelles :
Nom : Denis Billo
Localisation : France

Informations professionnelles :
Activité : Developpeur web et Access VBA
Secteur : High Tech - Éditeur de logiciels

Informations forums :
Inscription : janvier 2003
Messages : 282
Points : 122
Points : 122
Par défaut plusieurs divs dans un overflow

Bonjour,

Pas très doué avec le CSS...
J'essaye de faire une liste de photos sur la même ligne et mettre un overflow si il ya trop d'images pour qu'elles n'étirent pas la page.
Petit problème, les photos passent à la ligne au bout d'un certain nombre et l'overflow ne marche pas...
Voici mon code...

Code :
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<div style="overflow-x:scroll;overflow-y:hidden;clear:both;white-space: nowrap;">          
          <div style="width:15px;height:90px;background-color:#565B5C;float:left">&nbsp;</div>
          <div style="width:150px;background-color:#494D4E;padding:8px;text-align:center;float:left"><img src="maphoto.jpg" alt=""></div>
          <div style="width:15px;height:90px;background-color:#565B5C;float:left">&nbsp;</div>
          <div style="width:150px;background-color:#494D4E;padding:8px;text-align:center;float:left"><img src="maphoto.jpg" alt=""></div>
          <div style="width:15px;height:90px;background-color:#565B5C;float:left">&nbsp;</div>
          <div style="width:150px;background-color:#494D4E;padding:8px;text-align:center;float:left"><img src="maphoto.jpg" alt=""></div>
          <div style="width:15px;height:90px;background-color:#565B5C;float:left">&nbsp;</div>
          <div style="width:150px;background-color:#494D4E;padding:8px;text-align:center;float:left"><img src="maphoto.jpg" alt=""></div>
          <div style="width:15px;height:90px;background-color:#565B5C;float:left">&nbsp;</div>
          <div style="width:150px;background-color:#494D4E;padding:8px;text-align:center;float:left"><img src="maphoto.jpg" alt=""></div>
          <div style="width:15px;height:90px;background-color:#565B5C;float:left">&nbsp;</div>
          <div style="width:150px;background-color:#494D4E;padding:8px;text-align:center;float:left"><img src="maphoto.jpg" alt=""></div>
          </div>
          <div style="width:15px;height:90px;background-color:#565B5C;float:left">&nbsp;</div>
    </div>
__________________
VrroOOOAAAAAPPPPPPPPPP !!!
Décibel est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 20/02/2011, 21h41   #2
Modérateur
 
Avatar de NoSmoking
 
Homme
Inscription : janvier 2011
Messages : 2 930
Détails du profil
Informations personnelles :
Sexe : Homme
Localisation : France, Isère (Rhône Alpes)

Informations forums :
Inscription : janvier 2011
Messages : 2 930
Points : 4 744
Points : 4 744
Bonsoir,
supprimes les DIV qui contiennent tes images
Code html :
1
2
3
4
5
6
7
8
<div style="overflow-x:scroll;overflow-y:hidden;white-space: nowrap;">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
</div>
NoSmoking est déconnecté   Envoyer un message privé Réponse avec citation 00
Vieux 21/02/2011, 08h42   #3
Membre habitué
 
Denis Billo
Developpeur web et Access VBA
Inscription : janvier 2003
Messages : 282
Détails du profil
Informations personnelles :
Nom : Denis Billo
Localisation : France

Informations professionnelles :
Activité : Developpeur web et Access VBA
Secteur : High Tech - Éditeur de logiciels

Informations forums :
Inscription : janvier 2003
Messages : 282
Points : 122
Points : 122
Oui, merci la chose marche bien il fallait aussi rajouter des choses dans le overflow, voici le bon code dans sa totalité :

Code :
1
2
3
4
5
6
7
8
<div style="overflow-x:scroll;overflow-y:hidden;white-space:nowrap;width:750px;height:120px;">
<img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
  <img src="maphoto.jpg" alt="">
</div>
Une largeur oblige le scroll à s'afficher, sinon toutes les images sont sur une ligne droite et la page est étirée,
la hauteur donne un peu de beauté à la chose...

Merci
__________________
VrroOOOAAAAAPPPPPPPPPP !!!
Décibel est déconnecté   Envoyer un message privé Réponse avec citation 00
Réponse Proposer ce sujet en actualité Cette discussion est résolue.
Outils de la discussion



Fuseau horaire GMT +2. Il est actuellement 12h39.


 
 
 
 
Partenaires

Hébergement Web