Center HTML Input Text Field Placeholder

If you want to change only the placeholder style, select the ::placeholder pseudo-element

::placeholder {
   text-align: center; 
}

/* or, for legacy browsers */

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

:-moz-placeholder { /* Firefox 18- */
   text-align: center;  
}

::-moz-placeholder {  /* Firefox 19+ */
   text-align: center;  
}

:-ms-input-placeholder {  
   text-align: center; 
}

input{
   text-align:center;
}

is all you need.

Working example in FF6. This method doesn't seem to be cross-browser compatible.

Your previous CSS was attempting to center the text of an input element which had a class of "placeholder".

Tags:

Html

Css