How To Remove/Hide Placeholder Texts In Form-Inputs

hrhngx · Member · Dec 17, 2014 at 8:40 pm
Copy link

Add topic to favorites
I’m able to change color of the placeholder text in my subsciption form [Follow Blog widget] successfully but I fail when I attempt to remove it permanently by “display: none” even with “!important” keyword in the following codes:

::-webkit-input-placeholder {
color: #ffffff;
}

:-moz-placeholder {
/* Firefox 18- */
color: #ffffff;
}

::-moz-placeholder {
/* Firefox 19+ */
color: #ffffff;
}

:-ms-input-placeholder {
color: #ffffff;
}

How can I remove/hide those placeholder texts in that and similar ones such as search-bar?

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Dec 19, 2014 at 10:00 pm
Copy link
Use an RGB color declaration with an alpha opacity setting of 0.
color: rgba(0, 0, 0, 0);
I think that should work with all of them, but you will also have to specify a font color for the input with the following.
```
input#subscribe-field {
    color: #000;
}
```
hrhngx · Member · Dec 19, 2014 at 11:06 pm
Copy link
Now all clear about the placeholder texts thanks to you again as usual, sir!
I just had to deal with that I was only able to change its hex-color value in order to cover it when my slide-menu background was only #ffffff till I’ve assigned a background image there recently and have just solved the problem permanently with the help of your codes here…
Thank you very much again and again, sir!
thesacredpath · Member · Dec 20, 2014 at 2:04 am
Copy link
You are welcome.

No items found.