Hi all
J 3.7.2
VM 3.2.2
On the page below
https://www.fairytaleendings.co.uk/cart
There is a Coupon Code box but you cannot see the text 'Enter your Coupon Code' until you click in and out of it. I can see the text is there initially but greyed out/blurred so cannot be read.
I need the text 'Enter your Coupon Code' to be there by default so a user can see where to put the code.
I have successfully managed to style the text that appears when you click in and out of the box using the css below but cannot find how to style the blurred out text before you click in the box so it can be seen
.bd-bootstrapinput-3.form-control.input-sm {
font-size: 16px;
color: #e5007e;
}
Cheers
your template
select::-moz-placeholder,
textarea::-moz-placeholder,
input[type="text"]::-moz-placeholder,
input[type="password"]::-moz-placeholder,
input[type="datetime"]::-moz-placeholder,
input[type="datetime-local"]::-moz-placeholder,
input[type="date"]::-moz-placeholder,
input[type="month"]::-moz-placeholder,
input[type="time"]::-moz-placeholder,
input[type="week"]::-moz-placeholder,
input[type="number"]::-moz-placeholder,
input[type="email"]::-moz-placeholder,
input[type="url"]::-moz-placeholder,
input[type="search"]::-moz-placeholder,
input[type="tel"]::-moz-placeholder,
input[type="color"]::-moz-placeholder {
color: #dddddd;
opacity: 1;
}
select:-ms-input-placeholder,
textarea:-ms-input-placeholder,
input[type="text"]:-ms-input-placeholder,
input[type="password"]:-ms-input-placeholder,
input[type="datetime"]:-ms-input-placeholder,
input[type="datetime-local"]:-ms-input-placeholder,
input[type="date"]:-ms-input-placeholder,
input[type="month"]:-ms-input-placeholder,
input[type="time"]:-ms-input-placeholder,
input[type="week"]:-ms-input-placeholder,
input[type="number"]:-ms-input-placeholder,
input[type="email"]:-ms-input-placeholder,
input[type="url"]:-ms-input-placeholder,
input[type="search"]:-ms-input-placeholder,
input[type="tel"]:-ms-input-placeholder,
input[type="color"]:-ms-input-placeholder {
color: #dddddd;
}
select::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
input[type="text"]::-webkit-input-placeholder,
input[type="password"]::-webkit-input-placeholder,
input[type="datetime"]::-webkit-input-placeholder,
input[type="datetime-local"]::-webkit-input-placeholder,
input[type="date"]::-webkit-input-placeholder,
input[type="month"]::-webkit-input-placeholder,
input[type="time"]::-webkit-input-placeholder,
input[type="week"]::-webkit-input-placeholder,
input[type="number"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
input[type="url"]::-webkit-input-placeholder,
input[type="search"]::-webkit-input-placeholder,
input[type="tel"]::-webkit-input-placeholder,
input[type="color"]::-webkit-input-placeholder {
color: #dddddd;
}
first it's a placeholder and after you've click in and out, it's filled with JS
you need css for your placeholder
http://htmlcolorcodes.com/tutorials/css-placeholder-color/
Thank you both that additional CSS from GJC did the trick, looking better now
https://www.fairytaleendings.co.uk/cart