none
IE11でのtext-alignに関しまして RRS feed

  • 質問

  • はじめまして。
    IE11でのテキストボックスの挙動について質問させて頂きます。

    ■現象
    「style="text-align: right"」が指定されているテキストボックスに
    フォーカスを合わせカーソルを右端まで持ってくると、内容が左へ少しずれます。
    フォーカスアウト後も、位置はずれたままとなります。

    ■サンプルHTML

    <!DOCTYPE html>
    <html>
    <head lang="ja">
        <meta charset="UTF-8">
    </head>
    <body>
    <input type="text" style="text-align: right" value="■"/><br/>
    <input type="text" style="text-align: right" value="■"/><br/><br/>
    </body>
    </html>

    ※valueに意味はありません。半角/全角に関わらず同じ現象が発生します。

    ■確認環境
     ・OS
      Windows7 Professional Service Pack 1 32ビット
      Windows7 Professional Service Pack 1 64ビット

     ・ブラウザ
      IE11.0.9600.18282

    padding、text-autospace、marginを変更してみましたが変化はありませんでした。
    この現象を解消することは可能でしょうか?
    もしお分かりであれば解決策をご教示頂けましたら幸いです。

    2016年5月10日 4:20

すべての返信

  • 確かに私の環境(Win10 IE11&Edge と Win7 IE11)でも再現しました。

    原因は分からなかったのですが、

    <!DOCTYPE html>
    <html>
    <head lang="ja">
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=8">
    </head>
    <body>
    <input type="text" style="text-align: right" value="■"/><br/>
    <input type="text" style="text-align: right" value="■"/><br/><br/>
    </body>
    </html>

    ※バージョンを落とすと画面のレイアウトが崩れる可能性があります。

    というようにIEの互換バージョンを8に設定すると再現しなくなりました。

    2016年5月10日 11:32
  • こんな感じで取り消しの「X」が表示され、その分テキストが左にずれるのとは別の話ですか?


    hebikuzure

    2016年5月10日 12:25
    モデレータ
  • ご返信頂きましてありがとうございます!

    質問時に記載できておらず申し訳ございません。
    IE8であれば発生しないことは私でも確認していました。
    しかし今回はIE11で実装する必要がありまして(-_-)

    直せないなら直せないで、ブラウザのバグですという公式の情報があればいいのですが。

    2016年5月11日 1:52
  • ご返信頂きましてありがとうございます!

    はい「×」が出るということではありません。

    そのままカーソルを右端に持っていくと入力内容が少し左にずれ、
    フォーカスアウト後もずれたままとなってしまいます。
    2016年5月11日 1:54