p
u
b
l
i
c
i
t
é
publicité
  1. #1
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    juillet 2006
    Messages
    949
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Cameroun

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : juillet 2006
    Messages : 949
    Points : 408
    Points
    408

    Par défaut Mettre une image à la place d'un input submit

    Bonjour à tous,
    J'essaie de mettre sur mon site une image en lieu et place d'un bouton input submit.

    Code html
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
     
    <div id="search">
    <form  action="search.php" method="get">
    <input type="text" name='search' value='search...' class="field" />
    <input type="image" src="templates/images/search.png" alt="Rechercher" class="image" />
    </form>
    </div>
    Code css
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
     
    #search input.field { color: #777; height: 18px; line-height: 18px; border: solid 1px #999; padding: 2px; font-weight: normal; text-indent: 4px; }
    #search input.image {
    margin: 0 0 0 10px;
    }
    L'image apparait est décalé par rapport au champ de texte.

    Comment résoudre ce décalage. Vous pouvez le voir en ligne à url

    Merci pour votre aide...

  2. #2
    Invité régulier
    Inscrit en
    mars 2008
    Messages
    7
    Détails du profil
    Informations forums :
    Inscription : mars 2008
    Messages : 7
    Points : 7
    Points
    7

    Par défaut

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    #search input.image {
    margin:0.5em 0 0.5em 10px;
    }
    .field {
    border:1px solid #999999;
    color:#777777;
    float:left;
    font-weight:normal;
    height:18px;
    line-height:18px;
    padding:2px;
    text-indent:4px;
    }

  3. #3
    Membre éprouvé
    Homme Profil pro
    Développeur Web
    Inscrit en
    juillet 2006
    Messages
    949
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : Cameroun

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : Administration - Collectivité locale

    Informations forums :
    Inscription : juillet 2006
    Messages : 949
    Points : 408
    Points
    408

    Par défaut

    Citation Envoyé par Ozareff Voir le message
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
     
    #search input.image {
    margin:0.5em 0 0.5em 10px;
    }
    .field {
    border:1px solid #999999;
    color:#777777;
    float:left;
    font-weight:normal;
    height:18px;
    line-height:18px;
    padding:2px;
    text-indent:4px;
    }
    Exactement, merci à vous.

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

Discussions similaires

  1. Réponses: 5
    Dernier message: 28/08/2011, 12h45
  2. Mettre une image a la place du bouton parcourir
    Par Death83 dans le forum Syntaxe
    Réponses: 3
    Dernier message: 04/09/2005, 20h16
  3. [VB6] mettre une image sur un boutton
    Par dim dans le forum VB 6 et antérieur
    Réponses: 2
    Dernier message: 15/02/2004, 01h28
  4. Comment mettre une image en fond de JFrame
    Par marc26 dans le forum Débuter
    Réponses: 3
    Dernier message: 19/01/2004, 17h57
  5. Peut on mettre une image dans une BD MySQL ?
    Par maddog2032 dans le forum SQL Procédural
    Réponses: 3
    Dernier message: 25/07/2003, 16h18

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