IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

Mise en page CSS Discussion :

plusieurs divs dans un overflow


Sujet :

CSS

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre éclairé
    Profil pro
    Developpeur web et Access VBA
    Inscrit en
    Janvier 2003
    Messages
    457
    Détails du profil
    Informations personnelles :
    Localisation : France

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

    Informations forums :
    Inscription : Janvier 2003
    Messages : 457
    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 : 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
    <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>

  2. #2
    Modérateur

    Avatar de NoSmoking
    Homme Profil pro
    Inscrit en
    Janvier 2011
    Messages
    17 207
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Isère (Rhône Alpes)

    Informations forums :
    Inscription : Janvier 2011
    Messages : 17 207
    Par défaut
    Bonsoir,
    supprimes les DIV qui contiennent tes images
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    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>

  3. #3
    Membre éclairé
    Profil pro
    Developpeur web et Access VBA
    Inscrit en
    Janvier 2003
    Messages
    457
    Détails du profil
    Informations personnelles :
    Localisation : France

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

    Informations forums :
    Inscription : Janvier 2003
    Messages : 457
    Par défaut
    Oui, merci la chose marche bien il fallait aussi rajouter des choses dans le overflow, voici le bon code dans sa totalité :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Récupérer les coordonnées de plusieurs DIV dans une boucle PHP
    Par renaud26 dans le forum Général JavaScript
    Réponses: 4
    Dernier message: 05/11/2009, 10h23
  2. [HTML 4.0] Pointer sur plusieurs ancres dans plusieurs div en overflow
    Par Djakisback dans le forum Balisage (X)HTML et validation W3C
    Réponses: 3
    Dernier message: 16/10/2009, 12h28
  3. Comment centrer plusieurs div dans une page.
    Par solorac dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 20/11/2008, 14h06

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo