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 :

Placement icon dans un input


Sujet :

Positionnement en CSS

Mode arborescent

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre très actif
    Homme Profil pro
    chomeur
    Inscrit en
    Juillet 2014
    Messages
    128
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 49
    Localisation : France, Val de Marne (Île de France)

    Informations professionnelles :
    Activité : chomeur

    Informations forums :
    Inscription : Juillet 2014
    Messages : 128
    Par défaut Placement icon dans un input
    bonjours, j'essaie de mettre un icon-connexionutilisateur a l'interrieur de l'imput a droite
    mais sur google chrome c'est bon mis sur firefox il est hors de l'imput et pas a l'intérrieur de l'imput

    voilà la capture
    coment on peut mettre l'incon sur l'impt a droite car googlechrome c'est bon et pas sur firefox

    voilà le code

    Code html : 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
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    			    <div class="conexionhaut"><label for="username">Nom d'utilisateur :</label>
     
    				<div class="inputglob">
     
    				<span class="icon-connexionutilisateur" title=" utilisateur"></span>
     
    				<input placeholder="Enter Username" id="username">
     
    				</div>
    				</div>
     
    			    <div class="conexionhaut"><label for="password" title="mot de passe">Mot de Passe :</label>
     
    				<div class="inputglob">
     
    				<span class="icon-connexionmotpasse"></span>
     
    				<input type="password" placeholder="Enter Password" id="password">
     
    				</div>
     
    				<div class="inputglob">
    				<span onclick="toto()" class="icon-masquerdemasquermdp" title="Masquer et démasquer le mdp"></span>
     
    				</div>
    				</div>


    Code css : 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
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
          .conexionhaut
    	  {
    	  border-color:#CCCCCC; /* on affiche la couleur de la bordure */
      	  border-style: solid; /*  on affiche le style de l'a bordure */
    	  border-width:0px 0px 0px 0px; /* top right bottom left */
    	  margin:0px 0px 0px 0px;/* top right bottom left */
    	  padding:10px 10px 10px 10px;/* top right bottom left */
    	  overflow:hidden;
    	  min-height:40px;
    	  }
     
    .icon-connexionutilisateur:before, .icon-connexionmotpasse:before
    {
    position: absolute;
    top:0;
    left:245px;
    }	  
    	  .icon-masquerdemasquermdp:before
    	  {
    	  content: "\f06e";
    position: absolute;
    top:-15px;
    right:240px;
    	  }
    	  .icon-connexionutilisateur:before
    	  {
    	  content: "\f007";
    	  }
     
    	  .icon-connexionmotpasse:before
    	  {
    	  content: "\f023";
    	  }
     
    	  .inputglob
    	  {
    	  position: relative;
    	  }
     
    	  .inputglob input
    	  {
    	  background-color:#FFFFFF; /* Couleur de fond */
    	  min-height:20px;
    	  border-color:#CCCCCC; /* on affiche la couleur de la bordure */
      	  border-style: solid; /*  on affiche le style de l'a bordure */
    	  border-width:1px 1px 1px 1px; /* top right bottom left */
    	  margin:-5px 0px 0px 0px;/* top right bottom left */
    	  padding:0px 0px 0px 40px;/* top right bottom left */
    	  }

    coment je dois mettre mon iconnomon champmasquer a l'interrieur de l'imput a droite
    Images attachées Images attachées   

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

Discussions similaires

  1. Afficher un varchar complet dans un input text
    Par PrinceMaster77 dans le forum ASP
    Réponses: 4
    Dernier message: 25/06/2004, 13h17
  2. Icone dans barre taches napparait pas tjr(lancement session)
    Par souch dans le forum Composants VCL
    Réponses: 4
    Dernier message: 16/06/2004, 11h51
  3. icon dans treeview ou listview
    Par Sebinou dans le forum C++Builder
    Réponses: 12
    Dernier message: 31/03/2004, 01h29
  4. Afficher une icone dans DBgrid
    Par boyerf dans le forum Bases de données
    Réponses: 4
    Dernier message: 29/02/2004, 16h45
  5. Comment gérer plusieurs icones dans son exécutable ?
    Par declencher dans le forum Langage
    Réponses: 5
    Dernier message: 15/10/2003, 11h49

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