О теге <pre> я уже рассказывал не раз (например, здесь и здесь). Но получается, что рассказал не всё. То, о чём я буду говорить сегодня, скорее всего никому не пригодится. Особенно с учётом того, что известные мне современные браузеры это не поддерживают (или поддерживают криво). Однако кто знает, может где-то ещё работает забытый богом компьютер с каким-нибудь экзотическим браузером, который будет более-менее адекватно справляться с этим атрибутом.
Опять же есть разработчики-прагматики, а есть разработчики-фанатики. Первых такие сведения не волнуют. Им лишь бы как-то решить задачу и получить за это деньги. Неважно, как. Главное - быстро, и чтобы хоть как-нибудь работало.
Фанатики же увлечены процессом. Результат их не особо беспокоит. Но они хотят докопаться до самой сути и знать о своём предмете всё.
И то и другое - это крайности. Стремиться, я считаю, надо к “золотой середине”. Но лирическое вступление затянулось. Пора переходить к сути.
Итак, у тега <pre> есть один забавный атрибут - width. Он не является обязательным, но если вы его применяете, то он указывает количество символов, которые следует поместить в одной строке блока <pre>. Браузер будет использовать это значение, пытаясь подобрать шрифт и его размер таким образом, чтобы строка указанной ширины целиком поместилась в окне.
Это не означает, что браузер будет автоматически переносить текст в рамках ограниченного атрибутом width блока. Строки, которые окажутся шире, просто выйдут за границы блока <pre> (как и без ограничения ширины).
Атрибут width - это только пожелание - просьба браузеру впихнуть текст в указанные границы. А браузер может выполнить, а может и не выполнить эту просьбу. Ну и, поскольку это пожелание, то, видимо, современные браузеры это пожелание не выполняют. Видимо, разработчики считают, что раз есть горизонтальная полоса прокрутки, то и нефиг выпендриваться - берите, что дают.
Как видите, браузер никак не воспринимает наличие атрибута width в теге <pre>. Шрифт остаётся таким же, ни его размер, ни его вид не меняются.
Но расстраиваться по этому поводу не стоит. Потому как есть другие способы решить поставленную задачу, в том числе и с помощью HTML. Может поэтому современные браузеры и не поддерживают лишние функции.
На этом всё. Подписывайтесь на канал, чтобы ничего не пропустить.