【转】html 中 div不定宽度如何水平居中的解决方案

传统的水平居中样式 margin: 0 auto;

这个方法要求使用这个样式的dom元素,必须同时定义宽度width. 如果dom元素内容是不固定的,那么就无法定义宽度.所以这个地方就很难弄。

经过多次摸索终于找到解决方案. 经过测试发现兼容性还行。

.SecondMenuBody{
  display: table; /*重点就是这个属性,这个样式会告知浏览器当前元素的宽度,采用最小的宽度.不是默认全宽*/
  margin: 0 auto;
}
<div id="父元素" >
    <div class="SecondMenuBody">这里的内容永远相对父元素水平居中</div>
</div>

 

posted @ 2018-09-25 14:27  leo_as南京  阅读(382)  评论(0编辑  收藏  举报