不定宽元素为什么不能用margin：0 auto居中
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style>
*{
margin:0 auto;
padding: :0;
}
body,ul,li{
margin:0;
padding: 0;
}
li{
list-style: none;
}
a:link,a:visited{
text-decoration: none;
}
a:hover{
text-decoration: underline;
}
#outer{
}
#skin,#nav{
overflow: hidden;
}
#skin li{
float:left;
width:6px;
height:6px;
cursor:pointer;
overflow:hidden;
margin-right:10px;
text-indent:-9999px;
border-width:4px;
border-style:solid;
}
#skin li.current{
background:#fff!important;
}
#red{
border-color:red;
background:red;
}
#green{
border-color:green;
background:green;
}
#black{
border-color:black;
background: black;
}
#nav{
border:1px solid #fff;
}
#nav li{
float:left;
text-align:center;
border-right:1px solid #fff;
color:#fff;
}
</style>
<script>
</script>
</head>
<body>
<div id = "outer">
<ul id ="skin">
<li id="red" class title="红色">红</li>
<li id="green" class title="绿色">绿</li>
<li id="black" class = "current" title="黑色">黑</li>
</ul>
<ul id = "nav">
<li><a href="javascript:;">新闻</a></li>
<li><a href="javascript:;">娱乐</a></li>
<li><a href="javascript:;">体育</a></li>
<li><a href="javascript:;">音乐</a></li>
<li class="last"><a href="javascript:;">旅游</a></li>
</ul>
</div>
</ul>
</body>
</html>
这里我没有给outer设置宽度，不定宽下无法居中，想知道为什么margin：0，auto为什么不生效
qq_命运之骰_02回答
-
叫你猪猪
auto是块级元素才有效果，不定宽度相当于块级元素的宽度为100%，所以不会居中！ -
慕田峪5445673
outer是块级元素并且要有宽度 margin:0 auto;才会有效果 提示：*通配符这里的padding多了一个中文冒号
随时随地看视频慕课网APP
JavaScript
Html/CSS