如何水平对齐元素？

Question

我的情况很奇怪

我有类似的东西

<div class='test'>
    <button class='btn'></button>
   <div class='nest'>
      more...
   </div>
</div>

我的CSS

.test{
   z-index: 100;
   position: absolute;
   bottom: 15px;
   left: 1%;
   width: 98%;
   min-width: 500px;
   height: 45px;
   background: url(images/botnav_bg_shim.png) repeat-x;
   border-radius: 3px;
}

.btn{
   margin-left: 2px;
   width: 128px;
   height: 48px; 
   background:url(images/bot.png) no-repeat;
}

.nest{
   display: inline-block;
   margin-left: 10px;
   height: 45px;
   padding-left: 17px; 
   background:url(images/nest.png) no-repeat;
}

我的问题是我的按钮元素将无缘无故地被迫向下移动50px。 有人可以帮我吗？ 非常感谢！

Answer 1

删除或添加注释块（/ * ... * /）到

position: absolute;

在.test类中