html - 中心和比例输入控件

Question

鉴于此页面，我怎样才能更好地垂直居中并将 4 个按钮缩放为宽度的 50%（到浏览器的宽度）和高度的 20%（到浏览器的高度），而其他 20%（按钮将占用 80 % 因为它们有 4 个）高度均匀分布在它们之间？

Answer 1

检查这个小提琴：http: //jsfiddle.net/dj2fu/

你需要做几件事才能让它按照你想要的方式工作。

删除<br>s

应用以下 CSS：

html, body {
    min-height: 100%;
    position: relative;
    height: 100%;
    padding: 0;
    margin: 0;
}
#divMainMenu {
    margin: auto;
    height: 100%;
    width: 100%;
    display: table;
}
#divMainMenu input[type="button"] {
    display: block;
    width: 50%;
    margin: auto;
    height: 20%;
    margin-bottom: 2.5%;
    padding: 0;
    margin-top: 2.5%;
}​