写懵逼了，有点看不懂自己写的代码了，头有点大，后面还有更复杂的可咋办？
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>不定宽块状元素水平居中</title>
<style>
/*下面是任务区代码*/
div{
background:pink;
width:800px;
height:1000px;
border:2px solid green;
margin-left:auto;
margin-right:auto;
}
.wrap{
width:400px;
height:200px;
border:1px solid blue;
background:#ccc;
text-align:center;
line-height:200px;
margin-left:auto;
margin-right:auto;
}
.zed{
width:400px;
height:200px;
background:red;
border:green solid 2px;
text-align:center;
margin-left:auto;
margin-right:auto;
}
.faker{
margin-top:32px;
padding-top:30px;
background:green;
height:100px;
width:200px;
border:1px solid black;
margin-left:auto;
margin-right:auto;
}
</style>
</head>
<body>
<div>
<ul class="zed">
<div class="faker">
<li>我是第一行文本</li>
<li>我是第二行文本</li>
<li>我是第三行文本</li>
</div>
</ul>
<p class="wrap">设置我所在的div容器水平居中</p>
</div>
</body>
</html>
