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 :

alignement input avec image


Sujet :

HTML

  1. #1
    Membre régulier
    Inscrit en
    Avril 2003
    Messages
    84
    Détails du profil
    Informations forums :
    Inscription : Avril 2003
    Messages : 84
    Points : 70
    Points
    70
    Par défaut alignement input avec image
    Bonjour,
    j'ai un tableau banal :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    <table>
    <tr>
    	<td colspan="2">
    		Nom:
    		<input type="text" />
    		<img src="image.gif" />
    	</td>
    </tr>
    <tr><td>mo</td><td>nnnn</td></tr>
    </table>
    Mais je comprends pas pourquoi l'image est décalée par rapport à l'input.
    Merci de me dire comment bien les aligner [/code]

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 637
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 637
    Points : 66 661
    Points
    66 661
    Billets dans le blog
    1
    Par défaut
    décallé comment en haut en bas l'un en dessous de l'autre a droite a gauche ???

    je pense qu'un <br/> après l'input devrait résoudre ton problème mais je ne sais pas que alignement tu recherches ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre à l'essai
    Profil pro
    Inscrit en
    Octobre 2003
    Messages
    26
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Octobre 2003
    Messages : 26
    Points : 24
    Points
    24
    Par défaut
    Salut,

    Tu peux ajouter à ton image un attribut align="top" aligner le haut de l'image avec le haut du texte ou align="middle" ou align="bottom". Essaye ces paramères et peut etre un te conviendra
    Tu peux aussi essayer ca :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
     
    <img src="image.gif" style="vertical-align: text-bottom;" />

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 637
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 74
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 637
    Points : 66 661
    Points
    66 661
    Billets dans le blog
    1
    Par défaut
    on est peut être aussi en face d'une border d'image qui pose problème ...
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  5. #5
    Membre régulier
    Inscrit en
    Avril 2003
    Messages
    84
    Détails du profil
    Informations forums :
    Inscription : Avril 2003
    Messages : 84
    Points : 70
    Points
    70
    Par défaut
    Merci beaucoup !
    En mettant vertical-align:middle ça met l'image à la même hauteur que le texte. C'est malheureusement pas centré par rapport à l'input, mais bon....je me satisfait déjà de ça.
    Je mets mon topic en "résolu", mais si qqun a une idée pour centré l'image par rapport à l'input, je suis preneur ! merci

  6. #6
    Membre à l'essai
    Profil pro
    Inscrit en
    Octobre 2003
    Messages
    26
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Octobre 2003
    Messages : 26
    Points : 24
    Points
    24
    Par défaut
    Dans tout les paramètres dispo dans vertical-align, y en a pas un qui te permettra d'avoir ce que tu souhaites ?

    Voici une liste des valeurs possibles :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
     
    top = aligner en haut.
    middle = aligner au milieu.
    bottom = aligner en bas.
    baseline = aligner sur la ligne de base (ou en bas s'il n'y a pas de ligne de base).
    sub = mettre en indice (sans réduire la taille de la police).
    super = mettre en exposant (sans réduire la taille de la police).
    text-top = aligner sur le bord supérieur de l'écriture.
    text-bottom = aligner sur le bord inférieur de l'écriture
    sub et super dans ce cas ne seront pas trop utiles mais essaye les autres pour voir (si tu ne l'as déjà pas fait bien sur )

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

Discussions similaires

  1. Alignement texte avec image
    Par yanniks dans le forum Mise en page CSS
    Réponses: 3
    Dernier message: 15/03/2013, 15h15
  2. aligner input et image
    Par sam01 dans le forum Mise en page CSS
    Réponses: 4
    Dernier message: 23/04/2010, 12h34
  3. Alignement balises input avec MSIE !
    Par dnode57 dans le forum Balisage (X)HTML et validation W3C
    Réponses: 1
    Dernier message: 26/06/2008, 14h49
  4. Input type image avec variable
    Par tagasuk dans le forum Langage
    Réponses: 9
    Dernier message: 19/06/2007, 21h15
  5. Probleme avec les "input type="image" "
    Par khokho dans le forum Balisage (X)HTML et validation W3C
    Réponses: 9
    Dernier message: 26/03/2006, 17h12

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