html - 垂直对齐标签和文本框

Question

我的问题与我在互联网上发现的其他问题有所不同。我有两个列布局，每个都有50％的布局，其中有我的标签和输入字段。问题在于标签的文本，有时标签很长，有时仅一个单词。我已经尝试了所有方法，但是我只是无法使文本垂直居中对齐。我尝试过的事情line-height vertically-align display

Answer 1

IE7及其以下版本不完全支持display：inline-block声明，因此必须将display：inline与zoom：1 hasLayout hack结合使用，以模仿带有星型hack的声明来定位IE7。要同时对齐文本框和标签，我们可以使用vertical-align：middle属性，如下所示：

的CSS

input.textBox {
    margin-top: 5px;
    margin-bottom: 5px;
    height: 30px;
    width: 350px;
    font-size: 15px;
    font-family: Verdana;
    line-height: 30px;
    display:inline-block; 
    *display: inline;     /* for IE7*/
    zoom:1;              /* for IE7*/
    vertical-align:middle;
}

label.inputLabel {
    font-family: Verdana;
    font-size: 15px;
    line-height: 30px;
    display:inline-block;
    *display: inline;     /* for IE7*/
    zoom:1;              /* for IE7*/
}