Geek Answers Handbook

Text with center text on iPhone

Im using the HTML5 placeholder attribute to enter text. I can center the text the user enters, but not the placeholder text for the iPhone.

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; 
}
+5
source share
2 answers

It seems that binding webkit and moz properties like this does not work well 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; 
}
+2
source

If you want to apply CSS to your placeholders, there is a great answer here:

Change HTML5 input placeholder color with CSS

For things like color, this seems to work fine on iOS. In addition, according to this, this is all you need to center your placeholders on the iPhone:

::-webkit-input-placeholder { /* WebKit browsers */
    text-align:center;
}

iPhone (iOS 5.1.1), iPad (iOS 5.0.1) Safari (Win, 5.1.7). , , .

0

More articles:


All Articles