为什么设置了ul的外边距为auto之后仍然不能居中
<span>
<h1>Portfolio</h1><p>Lorem ipsum dolor sit amet,consectetur adipisicing elit,sed do eiusmodtempor incididunt ut labore et<br>dolore magna aliqua.enim ad minim veniam.</p>
<ul>
<li>All</li>
<li>WEB</li>
<li>SOFTWARE</li>
<li>WORKS</li>
<li>BRANDS</li>
</ul>
</span>
正在回答 回答被采纳积分+1
1、span是行级标签，给他设定宽高是没用的，要想给他设置宽高，必须把它变成块级元素，可以添加 display: block;或者 display: inline-block;
2、要让元素中的内容居中显示，给父元素添加margin：auto，不是给子元素，你要让ul里面的内容相对于span居中显示，那么就要给span添加margin属性。
3、你给ul设置了position: absolute;属性，当你设置了定位属性之后，ul已经脱离了文档流，及时你给父元素设置margin：auto也是无用的，因为它脱离了文档流。
4、上面是让ul居中，但是你ul里面的li没有办法居中，因为你让他们左浮动了，所以肯定不会居中，因此需要做填充一下就可以了，但是要事先计算一下。
祝学习愉快！
.
.main{height:971px;}
.main > span{ text-align:center;background-color:#fff;height:413px;position:relative;}
.main > span > h1{margin-top:121px;color:#f46208;margin-bottom:53px;}
.main > span > p{margin-bottom:68px;}
.main > span > ul{position:absolute; margin:auto;bottom:53px;right:0px;left:0px;width:530px;}
.main> span > ul > li{border:1px solid #f46208;
float:left;
margin-left:16px;}
- 参与学习 1887 人
- 提交作业 4643 份
- 解答问题 5760 个
有HTML和CSS基础，却不知道如何进阶？本路径带你通过系统学习，完成从“会做网页”到“做出好的动态网页”的蜕变，迈出成为前端工程师的第一步。
了解课程
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星