如何使文本占据其容器的整个宽度? [英] How to make text take full width of it's container?
问题描述
假设div的宽度为300px,我将如何设置文本的字体大小,以使它始终占据100%的宽度,考虑到文本的长度永远不一样(文本是一些动态标题)由php生成).小文本的字体必须比大文本小得多,等等.
Say the div have 300px of width, how would I set the font-size of the text, so that it would always take 100% of the width, considering the text is never the same length (the text is some dynamic titles generated by php). Smaller text would have to have a font a lot smaller than the bigger text, etc
推荐答案
这帮了我大忙
div {
text-align: justify;
}
div:after {
content: "";
display: inline-block;
width: 100%;
}
但是,使用该技巧时,我不得不强制元素的高度以防止其添加新的空行.
However using that trick I had to force the height of my element to prevent it for adding a new empty line.
也可以在此处查看解释: http://blog .vjeux.com/2011/css/css-one-line-justify.html
Also have look here for explanations: http://blog.vjeux.com/2011/css/css-one-line-justify.html
这篇关于如何使文本占据其容器的整个宽度?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!