新しいバージョンの Chrome 用に 2 行のテキストを含む input type="button" を作成する 質問する

新しいバージョンの Chrome 用に 2 行のテキストを含む input type=

<button>誰かが理由を説明できるなら、「不可能」という回答を受け入れます。ただし、この質問はそれを求めていないので、a を使用した回答は受け入れません。

2 行の単語を含む入力ボタンを作成しようとしていますが、Chrome の新しいバージョンではそれができません。試したことは次のとおりです。

キャリッジリターンセパレータ

    <input type="button" value="Line One&#13;&#10;Line Two"/>

    <input type="button" value="Line One\r\nLine Two">

使用できることはわかっていますが、これでは必要な場所にはwhite-space: normal;移動できません。<br>

input[type="submit"] {
    white-space: normal;
}

選択したボタンに新しい行を追加する方法はありますか?

つまり

1行目

2行目

ベストアンサー1

それが証明できないがありえない、ボタンを複数行に渡って配置するのは得策ではありませんinput。まず、HTML5仕様属性については次のようにのみ述べていますvalue

要素に値属性がある場合、ボタンのラベルはその属性の値でなければなりません。

「ボタンのラベル」は仕様のどこにも定義されていないことに注意してください。つまり、それをどのように解釈するかはブラウザベンダー次第であり、また、ベンダーが自由に解釈を変更できることも意味します。

Chrome チームがこのような変更を決定したことを、あなたは今目の当たりにしました。おそらく別のブラウザで、再び同じことが起こるかもしれません。したがって、今見つけた解決策は永続的なものではなく、ブラウザ ベンダーの気まぐれに左右されることになります。

そのため、<button>要素を使用することを強くお勧めします。 仕様により、改行などの HTML フォーマットを実行できることが保証されているからです。

おすすめ記事