パソ君
・input type「date」の値を左寄せするにはどうするの？
こんな疑問にお答えします。
input type「date」にて作成された値は、通常左寄せされます。
ただiPhoneやiPadのSafariで見ると、中央配置されてしまうんですよね。
デザインによっては左寄せしたいはず。
実はこれ、簡単に対策可能です。
ジト
すぐにできるよ！
ということで、この記事では「input type「date」の値を左寄せする」について解説していきます！
この記事でわかること
input type「date」の値を左寄せする
【解決】input type「date」の値を左寄せする【Safari・iPhone・iPad】
結論：下記コードを使えばSafariでも値を左寄せできます。
input[type="date"]::-webkit-date-and-time-value {
text-align: left;
}「::-webkit-date-and-time-value」に対して指定すればOK。
下記がサンプルになります。
See the Pen input type「date」の値を左寄せする➀ by jito-coder (@jito-coder) on CodePen.
iPhone・iPadのSafariで見てみてください！
値が左寄せになっていますよね。
【解決】input type「date」の値を左寄せする【Safari・iPhone・iPad】
- input type「date」の値はiPhoneやiPadのSafariで見ると中央配置される
- 「::-webkit-date-and-time-value」を使って左寄せすればOK
ジト
input type「date」の値を左寄せしたい時はためしてみてね！
