7rc0fa
Last Updated: January 02, 2018
·
10.1K
· moak

Hide placeholder text on focus

For webkit and Firefox

::-webkit-input-placeholder{
    color: #ccc;
    font-style:italic;
} 
:focus::-webkit-input-placeholder{
     text-indent: -999px
}
::-moz-placeholder{
    color: #ccc;
    font-style:italic;
}
:focus::-moz-placeholder{
     text-indent: -999px
}

5 Responses
Add your response

133

Just used this! Thanks for the tip

over 1 year ago ·
137

Cool tip. :)

over 1 year ago ·
4346

For -moz- there should be two :: like in webkit. Second You could add -ms-input

over 1 year ago ·
9745

Not working anymore in Firefox. But I just replaced text-indent with color: transparent; and it worked.

over 1 year ago ·
29540

nice!

over 1 year ago ·