Hide placeholder text on focus with CSS

Hide placeholder text on focus with CSS

HTML
<input type="text" placeholder="Enter your name">
CSS
input:focus::-webkit-input-placeholder {
    opacity: 0;
}

input:focus::-moz-placeholder {
   opacity: 0;
}
 
input:focus:-ms-input-placeholder {
    opacity: 0;
}
 
input:focus:-moz-placeholder {
   opacity: 0;
 }

DEMO

View Demo
1,590 Views
65061cookie-checkHide placeholder text on focus with CSS

Leave a Reply

Your email address will not be published. Required fields are marked *