Question

我正在尝试使用CSS将标签的文本放在控件的确切中心。下面的CSS仍然将文本留在标签的顶部。有什么想法吗？

CSS

.plate_well {
    float: left;
    margin: 0;
    padding: 0;
    height: 30px;
    width: 30px;
    text-align: center;
    vertical-align: 15px;   /* this doesnt do anything ?? */
    font-size: 7pt;
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
    -khtml-border-radius: 15px;
    border-radius: 15px;
    border: 1px solid #AAAAAA;

}

HTML

<label class="plate_well" id="foo">bar</label>

（我也有IE无法渲染曲线的问题，但这是一个单独的问题）

Answer 1

您可以使用line-height: 30px;来代替单行文本。 30px需要与您希望垂直居中文本的元素的高度相同。

注意：小提琴有height:40px，而有问题的代码有height:30px。只需选择line-height即可匹配高度。

vertical-align实际上会将整个<label>（和文本）向下移动，但仅适用于内联级和表格单元格。由于<label>已浮动，因此不适用于您的情况。

css位置标签文本在真正的中心（垂直和水平）而不移动标签

1 个答案: