这是我的目标
尝试添加文本对齐
但是好像文字不够长。
如何让短文本填满父级的宽度?
最佳答案
似乎 text-align 只适用于超出行的文本。 你可以使用 flexbox 来解决这个问题。 尽管它需要您将每个单词都包装在一个跨度中。不确定你打算在哪里使用它,但如果它只在一个区域,有 6 个单词,它可能适合你。
<div class="parent">
<p><span>bla</span> <span>bla</span> <span>bla</span></p>
</div>
//Mixins
@mixin flexbox($direction, $wrap, $justify, $align){
display: flex;
flex-direction: $direction;
flex-wrap: $wrap;
justify-content: $justify;
align-items: $align;
}
.parent{
width: 100%;
background: #eee;
margin-top: 20px;
p{
text-align: justify;
@include flexbox(row, wrap, space-between, center)
}
}
你可以在这里看到它:http://codepen.io/anon/pen/xtLIG
关于css - 如何用CSS证明填充固定宽度父项中的短文本?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26670271/