在跨度中垂直对齐文本

Question

我希望“text 2”与其前面的文字垂直对齐（即“text 1”此处）。

HTML code：

<span style='font-size:22px'>text 1</span><span class='two'>text 2</span>

CSS代码：

.two{
    color:red;
    font-size: 12px;
}

我认为vertical-align:middle类.two但它似乎不起作用..

以下是 fiddle

Answer 1

为您的文本内容创建一个容器，也许是一个范围，并执行以下操作：

span {
    display:inline-block;
    vertical-align:middle;
}

Answer 2

您可能需要将vertical-align同时应用于<span>。

span { vertical-align: middle }

http://jsfiddle.net/BBh4e/2/