<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>定位和居中问题</title>
</head>
<style>
*{margin:0;padding:0;}
.box{400px;height:200px;background:#ccc;position:absolute;left:50%;top:50%;margin-left:-200px;margin-top:-100px;z-index:999px;}
.box span{display:block;50px;height:50px;background:#fc0;position: absolute;}
.box_top{left:0;top:0;z-index:1;border-radius:0 0 50px 0;}
.box_bottom{right:0;bottom:0;border-radius:50px 0 0 0;}
</style>
<body>
<div class="box">
<span class="box_top"></span>
<span class="box_bottom"></span>
</div>
</body>
</html>