css - 如果自动获取宽度并居中?
本文介绍了css - 如果自动获取宽度并居中?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
问 题
如图,三个标签的地方,标签数量不一定,并且标签的字数也是不一定,因此总体的宽度也是不一定的,有什么办法让这这些标签自动居中吗?
使用margin:0 auto; width:auto;的结果是宽度表成了百分之百,
设置flote:left;的效果虽然宽度自动适应了但是不能居中
解决方案
给标签的父级容器添加css样式:
display:flex; justi-content:center;
代码示例:
.test{
display: flex;
justify-content: center;
}
p{
background: gray;
margin: 0 10px;
border-radius: 2px;
padding: 0 10px;
}
<div class="test">
<p>111</p>
<p>222</p>
<p>333</p>
</div>
这篇关于css - 如果自动获取宽度并居中?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文