传统的水平居中样式 margin:0auto; 这个方法要求使用这个样式的dom元素,必须同时定义宽度width. 如果dom元素内容是不固定的,那么就无法定义宽度.所以这个地方就很难弄.
经过多次摸索终于找到解决方案. 经过测试发现兼容性还行.
.SecondMenuBody{
display: table; /*重点就是这个属性,这个样式会告知浏览器当前元素的宽度,采用最小的宽度.不是默认全宽*/ margin: 0 auto;
}
<div id="父元素" >
<div class="SecondMenuBody">这里的内容永远相对父元素水平居中</div>
</div>
版权声明：本文为 走错路的程序员 原创文章，欢迎转载。