mozilla
Vos résultats de recherche

    :-moz-placeholder

    Obsolète
    Cette fonctionnalité a été supprimée du Web. Bien que quelques navigateurs puissent encore la supporter, elle est en cours d'éradication. Ne l'utilisez ni dans d'anciens projets, ni dans de nouveaux. Les pages et applications Web l'utilisant peuvent cesser de fonctionner à tout moment.

    Note: La pseudo classe :-moz-placeholder doit maintenant être utilisé avec la nouvelle écriture ::-moz-placeholder pseudo-element dans Firefox 19.

    « CSS « Référence CSS « Extensions Mozilla

    Sommaire

    La  pseudo-class :-moz-placeholder représente tous les éléments de formulaires possédant un attribut placeholder. Cela premets au dévellopeur web de personnaliser l'apparence du placeholder qui est gris clair par défaut. Cela peut ne pas bien marcher si vous avez changé la couleur de fond de l'élément de formulaire pour être de la même couleur. Par exemple vous pouvez utiliser cette pseudo-class pour changer la couleur de la police du placeholder.

    Exemple

    Cet exemple modifie la couleur du placeholder pour qu'il devienne vert.

    <!doctype html>
    <html>
    <head>
      <title>Placeholder Demo</title>
      <style type="text/css">
        input:-moz-placeholder {
          color: green;
        }
      </style>
    </head>
    <body>
      <input id="test" placeholder="Ce texte s'affiche en vert !">
    </body>
    </html>
    

    Voir cet exemple en action.

    Overflow

    Souvent, les éléments de saisie sont dramaticallement réduites sur les périphériques mobiles. Malheureusement, dans certains cas les placeholder des elements de saisie ne rentrent pas dans la largeur de l'élément de saisie, cela donne lieu à une coupure forcée. Pour parer à cette éventualité, vous pouvez utiliser text-overflow: ellipsis .

    input[placeholder] { text-overflow: ellipsis; }
    ::-moz-placeholder { text-overflow: ellipsis; } /* firefox 19+ */
    input:-moz-placeholder { text-overflow: ellipsis; }
    

    Ce fut David Walsh, qui a introduit ceci à beaucoup de designers. Placeholders et Overflow.

    Bugzilla

    bug 457801

    Notes

    Note: Ceci a été incorrectement documenté car il avait été créé pour Gecko 1.9  (Firefox 3), à des fins différentes.

    Voir aussi

    Étiquettes et contributeurs liés au document

    Contributors to this page: teoli, Titouan
    Dernière mise à jour par : teoli,