HTML change placeholder direction

Question

how to in styled input tag placeholder extends that parent style and i want to have right direction in left styled input.

for example this is my input:

<input type="password" style='direction:ltr;text-align:left;' id="password" placeholder="password">

placeholder text-align is left now. how to use direction:rtl for that?

Answer 1

I think this can help you.

input[type="text"]:-moz-placeholder {
    text-align: right;
}
input[type="text"]:-ms-input-placeholder {
    text-align: right;
}
input[type="text"]::-webkit-input-placeholder {
    text-align: right;
}

Demo

Answer 2

According to the docs: (http://www.w3.org/html/wg/drafts/html/master/forms.html#the-placeholder-attribute)

In situations where the control's content has one directionality but the placeholder needs to have a different directionality, Unicode's bidirectional-algorithm formatting characters can be used in the attribute value: