Question

Im using the HTML5 placeholder attribute for a text input. I can center the text that the user enters, but not the placeholder text for iPhones.

Ive tried the following:

input::-webkit-input-placeholder, 
input:-moz-placeholder,
::-webkit-input-placeholder,
:-moz-placeholder,
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder,
input:-moz-placeholder, textarea:-moz-placeholder,
{ 
text-align:center; 
}

Answer 1

Seems that bundling webkit and moz properties like that doesn’t play nicely with webkit. Try declaring webkit separately…

input:-moz-placeholder, :-moz-placeholder, 
input:-moz-placeholder, textarea:-moz-placeholder
{ 
text-align:center; 
}

input::-webkit-input-placeholder, ::-webkit-input-placeholder,
textarea::-webkit-input-placeholder
{ 
text-align:center; 
}