CSS：根據容器寬度調整字母之間的間距？

我已經垂直旋轉span元素，在它的一些文字：CSS：根據容器寬度調整字母之間的間距？

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 */ 
}

我怎樣才能使它所以從根據容器的高度跨度變化的文字字母之間的間距？基本上我想要的文本跨越整個元素的高度...

來源

2011-04-03 Alex

你想用CSS _only_？我認爲你必須使用JavaScript ... – Czechnology 2011-04-03 15:19:17

我使用jQuery無論如何，所以JavaScript是好的，但我不知道如何:( – Alex 2011-04-03 17:48:54

你也可以看看這個答案調整字母間距到容器的寬度：http://stackoverflow.com/questions/5976289/stretch-text-to-fit-width-of-div/23168507#23168507 – 2014-11-14 18:23:53

...某處，在JavaScript文件很遠很遠......

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

可以使用plugin found here，其中包含calculateSpacing功能，儘管它適用於寬度，高度不（所以做一些修改可能是必要的）：

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

來源

2011-04-04 05:41:54

我認爲你不能沒有javascrit它，因爲尺寸在％使用寬度，但不是高度。編寫一個腳本，將元素的高度除以裏面的字符數，並將其設置爲字母間距。

來源

2011-04-03 15:31:46

CSS：根據容器寬度調整字母之間的間距？

回答

相關問題