Как автоматически изменить пробел между буквами. Я хочу, чтобы текст занимал всю ширину div. Текст не является статичным. (Всегда меняя текст, может быть 123 "или" текстовый текст "...)
<style type="text/css">
#menu{
width: 200px;
background-color: #000;
color: #336699;
font-size: 16px;
letter-spacing: 100%;
}
</style>
<body>
<div id="menu">
tekstas
</div>
РЕДАКТИРОВАТЬ: К сожалению, это только меняет расстояние между словами, а не интервал между буквами. В CSS нет способа сделать кернинг. Возможно, CSS3.
Это легко выполнить с помощью атрибута text-align: justify CSS:
#menu
{
width: 200px;
background-color: #000;
color: #336699;
font-size: 16px;
text-align: justify;
}
Нет никакого способа сделать это чисто с CSS. Атрибут letter-spacing не принимает процентные значения. text-align: justify не будет работать либо потому, что он влияет только на пространство между словами, а не на кернинг шрифта, и он также применяется только к тем строкам текста, за которыми следуют другие строки.
Вы можете попробовать использовать JS для этого, подсчитав количество символов в конкретном div, а затем вычислить необходимое пространство между символами, чтобы оно заполнило ширину, но это решение будет работать только с моно- (шрифты с одинаковой шириной для всех символов).
Здесь решение не будет работать для всех, но оказалось, что для меня проблема: если вы показываете короткий текст заголовка, вы можете поместить пробел между каждым символом каждого слова "L ikethis".
Для моей конкретной конструкции это выглядит хорошо, и, конечно, он позволяет align: justify полностью выполнять свою магию в div.