I want to show opacity:1 for input[type="number"] placeholders

Question

I have one form having input[type="number"].

Placeholder shows reduced opacity on browsers. I want to show opacity:1 for input placeholders. It is showing correct for input[type="text"] but not for input[type="number"].

Not getting why is it so.

CSS:

input::-moz-placeholder{
  opacity: 1
}

textarea::-moz-placeholder{
  opacity: 1
}

Can anyone help me?

possible duplicate of [Change input placeholder color darker](http://stackoverflow.com/questions/15497550/change-input-placeholder-color-darker) — Kheema Pandey, May 27 '15 at 08:26

score 1 · Answer 1 · edited Nov 21 '15 at 10:04

1

Try marking the css as important so that would be rendered

input::moz-placeholder
{
   opacity:1 !important
}

edited Nov 21 '15 at 10:04

Alex

8,461
6
37
49

answered May 27 '15 at 07:26

bhanu.cs

1,345
1
11
25

score 0 · Answer 2 · answered May 27 '15 at 08:15

0

It's a bug in firefox. Which seems not working in firefox.

Check Firefox bug And Firefox bug

answered May 27 '15 at 08:15

ketan

19,129
42
60
98

Sorry for late reply but ya its a bug in firefox so any other experiment ? – Atul Bhalerao Aug 02 '15 at 07:12

score 0 · Answer 3 · answered May 27 '15 at 08:40

try this with extended support

input[type="number"]::moz-placeholder { 
  opacity:1 !important;
}
input[type="number"]:moz-placeholder { 
  opacity:1 !important;
}
input[type="number"]::-webkit-input-placeholder { 
  opacity:1 !important;
}

input[type="number"]:-ms-input-placeholder { 
  opacity:1 !important;
}

I want to show opacity:1 for input[type="number"] placeholders

3 Answers3