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

HTML Discussion :

[HTML] Espacement incongru.


Sujet :

HTML

  1. #1
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut [HTML] Espacement incongru.
    Bonjour,

    Un problème qui survient souvent et que j'aimerais une fois pour toutes éradiquer est l'espacement généré au retour à la ligne dans l'éditeur texte.

    Exemple flagrant : http://josselin.willette.free.fr/test/test.html

    Dans le premier cas, le code est tel que :

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <img src="1.gif" />
    <img src="2.gif" />
    <img src="3.gif" />

    Dans le second :

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    <img src="1.gif" /><img src="2.gif" /><img src="3.gif" />

    Evidemment le résultat cherché est le second, mais faut-il délaisser l'indentation et le code propre au détriment de tout le code sur une seule ligne ?

    Ceci n'est bien sûr qu'un exemple parmi tant d'autres.

    Si vous avez une solution pour garder le code tel qu'il est dans le premier cas, je suis preneur.

    Merci de vos réponses.

  2. #2
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Par défaut
    Salut,

    Les images sont des éléments en ligne...
    Le problème que tu décris est je pense, un comportement normal.

    Quand tu écris du texte dans ton éditeur et que tu fais un retour chariot, tu t'attends bien à voir un espace qui lui correspond lors de l'affichage html...

    Solution... Les passer en bloc via css avec tout ce que ca implique ( un élément par ligne nottament), ou alors conserver le code de ton deuxième exemple...
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  3. #3
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Je dois donc pour chacune de mes images utiliser un float:left dans un div comme :
    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    <div style="float:left"><img src="1.gif" /></div>
    <div style="float:left"><img src="2.gif" /></div>
    <div style="float:left"><img src="3.gif" /></div>
    ?

    J'aurais justement aimé éviter les float ... :/

  4. #4
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Par défaut
    J'aurais justement aimé éviter les float ... :/
    Tout a fait d'accord,

    Les éléments floats réagissent vraiment différement et sont sortis du flux...
    Pour moi, c'est écraser une mouche avec une bombe atomique... Attention aux dommages colatéraux et aux retombés radioactives (le positionnement des autres éléments)

    Moi, j'assumerais les <img ... /> sur une même ligne...
    Avec des éditeurs qui te font un retour à la ligne automatique (juste pour l'affichage du code...), c'est forcément un peu plus fouillis mais ce n'est pas si génant que ça...

    Gvim, par exemple, fait parti de ce genre d'éditeur
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  5. #5
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Citation Envoyé par MasterOfChakhaL
    Moi, j'assumerais les <img ... /> sur une même ligne...
    Sauf quand tu as une dizaine d'images chacune avec un lien et des attributs onmouseover et onmouseout, ça devient vite une ligne ingérable.

  6. #6
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Par défaut
    c'est pour ca que je dis que j'assume et non que je le fais avec joie...

    Comme je te l'ai dit dans mon premier post, je considère ceci comme un fonctionnement normal (pas forcément pratique). Je ne crois pas que modifier les propriétés d'affichage pour rendre le code lisible soit une bonne idée.

    Rien ne t'empêche d'écrire ta page avec l'indentation qui te plait. Une fois que tes tests sont finis, tu vires les espaces...

    Je ne vois pas de réel problème (juste une petite frustration).
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  7. #7
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    Citation Envoyé par MasterOfChakhaL
    Comme je te l'ai dit dans mon premier post, je considère ceci comme un fonctionnement normal (pas forcément pratique).
    Je sais malheureusement que ce comportement est normal, je sondais juste, peut-être quelqu'un avait-il trouvé la solution (miracle) ?
    Citation Envoyé par MasterOfChakhaL
    Rien ne t'empêche d'écrire ta page avec l'indentation qui te plait. Une fois que tes tests sont finis, tu vires les espaces...
    Seulement sur une home page en éternelle mise-à-jour je serai obligé de réindenter le code à chaque fois que je veux le modifier.
    Citation Envoyé par MasterOfChakhaL
    Je ne vois pas de réel problème (juste une petite frustration).
    Certes, mais avoue que trouver une solution pratique à cette frustration pourrait arranger pas mal de choses.

  8. #8
    Membre Expert
    Avatar de trotters213
    Profil pro
    Inscrit en
    Janvier 2005
    Messages
    2 571
    Détails du profil
    Informations personnelles :
    Âge : 39
    Localisation : France, Gard (Languedoc Roussillon)

    Informations forums :
    Inscription : Janvier 2005
    Messages : 2 571
    Par défaut

    avec une marge négative de 4 pixels normalement c'est bon.

  9. #9
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    @trotters213 : C'est de la bidouille ça.

    Mais ça fonctionne.

    Et dans le cas de :

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    <table>
      <tr>
        <td>
          <img src="1.gif" />
        </td>
      </tr>
    </table>
    au lieu de :

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    <table>
      <tr>
        <td><img src="1.gif" /></td>
      </tr>
    </table>
    ?


  10. #10
    Rédacteur
    Avatar de MasterOfChakhaL
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2004
    Messages
    2 147
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 45
    Localisation : France

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Juin 2004
    Messages : 2 147
    Par défaut
    si tu ne mets qu'une seule image par cellule, un display:block sur l'image devrait suffire.
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    N'oubliez pas de cliquer sur quand votre question à trouvé une solution.

    Si vous n'avez pas encore lu les règles du club, mieux vaut tard que jamais!

  11. #11
    Modérateur
    Avatar de Bisûnûrs
    Profil pro
    Développeur Web
    Inscrit en
    Janvier 2004
    Messages
    9 931
    Détails du profil
    Informations personnelles :
    Âge : 42
    Localisation : France, Rhône (Rhône Alpes)

    Informations professionnelles :
    Activité : Développeur Web

    Informations forums :
    Inscription : Janvier 2004
    Messages : 9 931
    Par défaut
    @MasterOfChakhaL : Et si j'ai du texte et plusieurs images, je dois donc encadrer le tout d'un div ?

    Réponse après test : oui.

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

Discussions similaires

  1. [HTML] Espace genant dans formulaire avec bouton image
    Par lysandre dans le forum Balisage (X)HTML et validation W3C
    Réponses: 11
    Dernier message: 04/10/2007, 15h11
  2. [HTML] espace autour d'une image
    Par zooffy dans le forum Balisage (X)HTML et validation W3C
    Réponses: 6
    Dernier message: 22/10/2006, 16h18
  3. [HTML] espace en HTML
    Par gregagne dans le forum Balisage (X)HTML et validation W3C
    Réponses: 2
    Dernier message: 08/04/2006, 13h30
  4. [HTML] espace indésiré en deux cellule, comment y remédier?
    Par samuelMB dans le forum Balisage (X)HTML et validation W3C
    Réponses: 2
    Dernier message: 07/04/2006, 21h11
  5. [HTML] espaces en trop
    Par Anduriel dans le forum Balisage (X)HTML et validation W3C
    Réponses: 2
    Dernier message: 18/11/2005, 20h44

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