Been searching all over and can't seem to find the answer to this:
I have a checkbox that disables several forms if unchecked. The forms are styled to change color, but the placeholder text remains the same. How can I fix this? (alternatively, I wouldn't mind even just removing all placeholder text)
Thanks!
CSS only provides the styling, it can not remove the actual placeholder. What you can do it, set the placeholder text color as your background color of textbox, so it will look like you don't have placeholder..
Answer: Use the disabled and selected Attribute However, you can create similar effect by using the HTML disabled and selected attribute on a <option> element that has empty value. You can also apply the attribute hidden , which hides the placeholder option once selection is made in the dropdown.
CSS ::placeholder SelectorThe ::placeholder selector selects form elements with placeholder text, and let you style the placeholder text. The placeholder text is set with the placeholder attribute, which specifies a hint that describes the expected value of an input field.
The simplest way of auto-hiding a placeholder text upon focus is using the onfocus and onblur events with the <input> element.
You can style placeholder pseudo-elements in css, so you could write the following css:
input:disabled::-webkit-input-placeholder { /* WebKit browsers */
color: #fff;
}
input:disabled:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
color: #fff;
}
input:disabled::-moz-placeholder { /* Mozilla Firefox 19+ */
color: #fff;
}
input:disabled:-ms-input-placeholder { /* Internet Explorer 10+ */
color: #fff;
}
assuming that white is also inputs background.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With