Question

我的问题与我在网上发现的其他问题有点不同。我有两个列布局，每个都有50％，我有标签和输入字段。问题是标签的文字，有时它很长，有时只有一个字。我尝试了所有的东西，但我不能让文本垂直居中对齐。我尝试过的事情line-height vertically-align display

Answer 1

The display:inline-block declaration is not fully supported by IE7 and below, so you have to use display:inline instead in conjunction with the zoom:1 hasLayout hack to imitate the declaration with the star hack to target IE7. To align both the textbox and labelwe can use the vertical-align:middle property, like so:

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*/
}

垂直对齐标签和文本框

1 个答案: