CSS Center 表格垂直和水平

Question

我将图像设置为 DIV 中的背景，并希望将两个选择框(垂直和水平)居中。我能够水平居中表格，但垂直居中，不会发生。表单位于 DIV 底部的中心。

这是我的 CSS:

#box
{
background-image: url(../images/box.gif);
background-repeat:no-repeat;
display: table-cell;
vertical-align: middle;
width:665px;
padding-top:65px;
text-align:center;
}

这是我的 HTML:

<div id="box"> 
<select id="Select0">
<option selected>Show Selections By</option>
<option value="1">value1</option>
</select>
<select id="Select1">
<option selected>Select State</option>
<option value="1">value1</option>
</select>
<input type="image" onclick="jsfunsrcg()" src="./images/submit.png" alt="Submit Button">
<input type="image" onclick="jsfunsrc="./images/reset.png" alt="Reset">
</div>

我一直在查看网络资源，并尝试其他带有边距的选项，这导致框 DIV 在整个页面上移动。我将所有内容都移回原点，并认为我会征求社区的一些建议......感谢任何人愿意添加的任何意见。谢谢，--马特

Answer 1

这是你的填充。关闭它并给盒子一个明确的高度。 http://jsfiddle.net/SZ8jS/