Перенос текста на кнопке | CSS

Перенос текста в button и input

Первый вариант наиболее хорош.



<button>слово<br>слово</button>


<input value="слово
слово" type="button">


<input value="слово&#13;&#10;слово" type="button" class="raz">


<input value="слово&#x00A;слово" type="button">


<input type="button" value="слово слово" style="width: 5em; white-space: pre-line;">

Перенос длинного слова в кнопке

Первый вариант позволяет сделать так, чтобы ширина кнопки не превышала ширину родителя («резиновая, сужающаяся кнопка»), а её содержимое переносилось на новую строку при необходимости.

Тег button

<button style="word-break: break-all;">11111111111111111111111111111111111111111111111</button>
<button style="white-space: pre-line;">11111111111111111111111111111111111111111111111</button>
<button style="overflow-wrap: break-word;">11111111111111111111111111111111111111111111111</button>
<button style="word-wrap: break-word;">11111111111111111111111111111111111111111111111</button>
<button style="-webkit-hyphens: auto; -ms-hyphens: auto; hyphens: auto;">11111111111111111111111111111111111111111111111</button>
<button>11111&shy;111111111111111111111111111111111111111111</button>
<button>11111&#8203;111111111111111111111111111111111111111111</button>

Тег input

в f t
наверх ↑

Комментариев нет: