Ion datetime placeholder align

Ionic Framework
1

how to align placeholder of ionic date time o be centered

12-1-2018%2012-09-36%20PM

2

text-center doesn’t work?

3

it doesn’t work :frowning:

4

also i need icons to be inside the input

5

ok, from my side can’t do more without code

1 Like
6 
   <ion-item class="label">
          <ion-input type="text" value="" text-center placeholder="الإسم"></ion-input>
          <ion-icon name="ios-person-outline" item-left></ion-icon>
        </ion-item>
        <ion-item class="label">
          <ion-input type="text" value="" text-center placeholder="الإيميل"></ion-input>
          <ion-icon name="ios-mail-outline" item-left></ion-icon>
        </ion-item>
        <ion-item class="label">
          <ion-input type="password" text-center placeholder="كلمة المرور"></ion-input>
          <ion-icon name="ios-lock-outline" item-left></ion-icon>
        </ion-item>


        <ion-item class="label">
          <ion-datetime displayFormat="MM/DD/YYYY" pickerFormat="MM DD YYYY" text-center placeholder="تاريخ الميلاد"
            doneText="تم" cancelText="تراجع"></ion-datetime>
          <ion-icon name="ios-calendar-outline" item-left></ion-icon>
        </ion-item>
7

Ok so I don’t think you can out of the box, maybe I’m wrong, if so be my guest and correct me, would like to learn what I missed.

If I’m not wrong, your options, spontaneously I would say

  1. Don’t use ion-item as the shadowed div.item-native has a value justify-content: space-between

  2. Provide a PR to add a css4 variables (but not sure it will be accepted, I mean it’s not an iOS/Android behavior to have item centered)

  3. Dirty inject css with javascript in your shadow dom