.btn-wrap{width: 90%; margin: 0 auto; position: relative;top:50%; }
a.btn-rgl{display:block;background:#FD5F56;height:40px;color:#fff;}
<div class="btn-wrap">
<a href="#" class="btn-rgl">我怎么没动?</a>
</div>
就是上面简单的代码,在线预览http://jsbin.com/dipipisuso/edit?html,output
我设置了position: relative;top:50%;但是为什么这个区域没向下移动呢?竟然紧贴顶部!!??
父级元素没有高度,百分比无论多大浏览器都解析不出具体数值。
你可以测试:
1 50%改成50px,效果就出现了
2 给父级加上高度,例如:html,body{height:100%;}
你用绝对定位试试,position:absolute