I'm having trouble styling this placeholder in Firefox 13.0.1
Here is the input field with a placeholder:
<input class="textFieldLarge" placeholder="Username" id="username" name="username" type="text" />
This is the CSS associated with it:
.textFieldLarge{
width:400px;
height:50px;
line-height:50px;
padding-left:5px;
padding-right:5px;
background:none;
background-color:#FFF;
border:solid 1px #BBB;
font-family:Arial, Helvetica, sans-serif;
font-size:20px;
color:#333;
}
.textFieldLarge::-webkit-input-placeholder, .textFieldLarge:-moz-placeholder{
font-style:italic;
color:#BBB;
}
The goal is to style the text field's text as #333 and the placeholder as #BBB in italic. It's working fine in Chrome and IE but not in Firefox.
EDIT, I FOUND THE ISSUE - I APPLIED ::-webkit-input-placeholder SIMULTANEOUSLY
I would still appreciate a solution, although I think it might not be possible since it works when applied separately. It's not a major issue now, just a little frustrating.