1. #1
    Membre habitué Avatar de solorac
    Inscrit en
    avril 2007
    Messages
    476
    Détails du profil
    Informations personnelles :
    Âge : 47

    Informations forums :
    Inscription : avril 2007
    Messages : 476
    Points : 136
    Points
    136

    Par défaut Ecart entre image dans une class

    Bonjour la Communauté,

    Je cherche à mettre le même écart entre plusieurs images mais rien ne fonctionne comme je voudrais.
    Cela me semble pourtant très facile, cela fait 1h que je suis dessus et je ne trouve pas. Une petite aide svp ,

    Voici mon code html :
    Code html : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    <div class="thumbsn">
    <p>
    <a href="a1.html"><img src="../../images/N2!/down.png"></a>
    <a href="a2.html"><img src="../../images/N2!/part.png"></a>
    <a href="a3.html"><img src="../../images/N2!/com.png"></a>
    <a href="a4.html"><img src="../../images/N2!/photo.png"></a>
    </p>

    Le code CSS :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    .thumbsn img {
    border:1px solid #F28C28;
    background-color: #F28C28;
    }
    .thumbsn img:hover {
    background: url(images/flash.gif);
    }
    .thumbsn p {
    text-align:center;
    margin-top:0px;
    margin-bottom:0px;
    padding:0px;
    }
    Je voudrais un écart de 50px.

    Merci pour votre aide;

  2. #2
    Modérateur

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

    Informations forums :
    Inscription : janvier 2011
    Messages : 11 948
    Points : 25 507
    Points
    25 507

    Par défaut

    Bonjour,
    généralement les écarts entre éléments se gèrent via la propriété margin.

    Nota : suivant ce que tu souhaites réaliser la solution peut être ailleurs !

  3. #3
    Rédacteur/Modérateur
    Avatar de jreaux62
    Homme Profil pro
    Webdesigner
    Inscrit en
    août 2008
    Messages
    10 397
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 50
    Localisation : France, Pas de Calais (Nord Pas de Calais)

    Informations professionnelles :
    Activité : Webdesigner
    Secteur : Arts - Culture

    Informations forums :
    Inscription : août 2008
    Messages : 10 397
    Points : 20 762
    Points
    20 762

    Par défaut

    Bonne journée,


    Regarde du côté de flexbox.
    "Si tu suis le chemin qui s'appelle « plus tard », tu arriveras à la place qui s'appelle « jamais »."
    François Camille Prévot (1910-1996), instituteur puis Directeur d'école et... mon grand-père.
    "Pose ta question, tu seras idiot une seconde. Ne la pose pas, tu seras idiot toute ta vie."
    Albert Einstein (1879-1955).
    Mes tutos DVP
    Gestion-Affichage de Nouvelles
    Affichage en tableau HTML
    Fonctions de redimensionnement d'images

  4. #4
    Membre habitué Avatar de solorac
    Inscrit en
    avril 2007
    Messages
    476
    Détails du profil
    Informations personnelles :
    Âge : 47

    Informations forums :
    Inscription : avril 2007
    Messages : 476
    Points : 136
    Points
    136

    Par défaut

    Bonjour,

    Flexbox me paraissait bien mais je ne peux gérer l’écart voulu entre chaque image.
    Quant aux margin, je n'arrive pas à mettre un écart de 50 entre chaque image.

  5. #5
    Membre habitué Avatar de solorac
    Inscrit en
    avril 2007
    Messages
    476
    Détails du profil
    Informations personnelles :
    Âge : 47

    Informations forums :
    Inscription : avril 2007
    Messages : 476
    Points : 136
    Points
    136

    Par défaut

    C'est bon j'ai trouvé, il suffisait que j'indique l'endroit où je voulais que les écarts soient mis :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    .thumbsn p img {
    border:1px solid #F28C28;
    background-color: #F28C28;
    margin-left:50px;
    }

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

Discussions similaires

  1. Réponses: 3
    Dernier message: 10/03/2012, 09h27
  2. 2 images dans une classe,non visible ie mais ok pour chrome
    Par nawak.seb dans le forum Mise en page CSS
    Réponses: 2
    Dernier message: 05/10/2009, 20h22
  3. Applet: dessiner une image dans une classe
    Par accion mutante dans le forum AWT/SWING
    Réponses: 2
    Dernier message: 24/07/2009, 23h33
  4. probleme d'image dans une class
    Par jerem721 dans le forum Graphisme
    Réponses: 2
    Dernier message: 30/12/2007, 16h20
  5. Afficher une image dans une classe héritant de Jframe
    Par condor_01 dans le forum Fenêtres/Dialogues
    Réponses: 3
    Dernier message: 27/04/2006, 23h11

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