Html 如何将按钮与列表框的中心对齐

我有两个列表框，我在其中移动一个框到另一个框的数据。我的列表框如下

<select id="sourceCars" class="car" size="20" >
    <option>User 1 </option>
    <option>User 2 </option>
    <option>User 3 </option>
    <option>User 4 </option>
    <option>User 5 </option>
</select>

<input type="button" value=" >> " id="moveRight">
<input type="button" value=" << " id="moveLeft">
<select id="targetCars" class="car" size="20" >
</select>​

用户1
用户2
用户3
用户4
用户5
​

---

我想要的是，将按钮

>

使用位置作为绝对值，然后设置左值和顶值

---

请参见此处的代码：

对于在中心设置，您使用此css代码

margin:0 auto;
width:250px;

}

请注意，-150px应替换为所选高度的一半。给这些按钮添加一些类将使事情变得容易。例如：

.moveBtn {
  position:relative;
  top:-150px;
}

.汽车{
浮动：左；
}
.屁股{
边缘顶部：150px；
宽度：70px；
浮动：左；
}​

---

请确保在输入时不要使用多个id。您的代码可以工作，但设计不好。在这个列表之前我有很多文本框。。。我只看到按钮在顶部。也永远不要使用px，因为你不知道哪个桌面有什么分辨率。。。

.moveBtn {
  position:relative;
  top:-150px;
}

 <div class="butts">   
       <input type="button" value=" >> " id="moveRight">
       <input type="button" value=" >> " id="moveRight">
 </div>

.car{
    float:left;
}
.butts{
    margin-top:150px;
    width:70px;
    float:left;
}​