CSS: регулировка расстояния между буквами в зависимости от ширины контейнера? - PullRequest
2 голосов
/ 03 апреля 2011

У меня есть вертикально повернутый элемент span с некоторым текстом в нем:

span{
  -webkit-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -moz-transform: rotate(-90deg);
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
  height: 100%;
}

.container{
  width: 40px;
  height: 500px;  /* <- this can change */
}

Как я могу сделать так, чтобы расстояние между буквами текста из span менялось в зависимости от высоты контейнера?По сути, я хочу, чтобы текст занимал всю высоту элемента ...

Ответы [ 2 ]

4 голосов
/ 04 апреля 2011

... где-то, в файле javascript очень далеко ...

$(".container").each(function(idx, el) {
    $(el).css("letter-spacing", calculateSpacing(el, $(el).height()));        
});

Вы можете использовать плагин , найденный здесь , который содержит функцию Calculate, хотя и работаетпо ширине, а не по высоте (поэтому могут потребоваться некоторые изменения):

http://heychinaski.com/jquery/js/jquery.charjustify.js

3 голосов
/ 03 апреля 2011

Я думаю, что вы не можете сделать это без javascrit, потому что размеры в% используют ширину, но не высоту.Напишите скрипт, который делит высоту элемента на количество символов в нем и устанавливает его как межбуквенный интервал.

...