CSS Valign不同的文本行跨度

我目前正在为一个我的网站的页面使用标签式布局，而我在不同标签中垂直对齐文本时出现问题，因为它们中的一些跨越一行，一些跨越两行。我需要将文本放在每个选项卡的中间，并且不要让文本与第一行对齐。CSS Valign不同的文本行跨度

到目前为止，我已经尝试过Valign和Line-height，但它们不是很有帮助。

2012-08-10 user1590687

请发布您需要帮助的代码。否则，你会得到像尝试这样的建议并尝试。通过代码，我们可以给你一个明确的答案。 – j08691 2012-08-10 15:48:06

你应该使用vertical-align: middle，但要意识到，为了使所要附加您需要使用display: table-cell。

例如，如果你使用类似这样的HTML结构的东西：

<div class="container"> 
    <span>Some Text</span> 
</div>

然后，你可以得到想要的定心使用：

.container { 
    text-align: center; 
    display:table-cell; 
    vertical-align:middle 
}

这里是一个JSFiddle例子。

此

来源

2012-08-10 15:52:47

如果您需要的文本为中心的垂直和水平方向，使用：

text-align: center; 
vertical-align: middle;

valign是td元素的HTML属性，所以它可能不会运行在你的“标签”

来源

2012-08-10 15:46:53 Samuel

我不知道为什么，但纵向排列对文字无任何影响 height：32px; text-align：center; font-weight：bold; font-family：arial，sans-serif; font-size：14px; \t \t \t min-height：2em; padding-top：12px; 这就是我到目前为止 – user1590687 2012-08-10 15:49:24

@ user1590687如果您发布您的HTML和CSS，则遇到问题，我们可以更好地帮助您将文本居中 – Samuel 2012-08-10 15:50:16

使用行高前）的line-height：20px的

来源

2012-08-10 15:51:57 extremeFE

这将使文本居中，但它可能会导致多行文本中断，行的 – Samuel 2012-08-10 15:52:41

一个真正有用的读取是understanding vertical align。

我假设你在讨论每个选项卡上的标签。您可以使用该页面的技巧之一，并将标签文本置于内部容器中居中。

关闭我的头顶，你试过了吗：
line-height:100%;？这可能会将行高设置为父级的高度，或者可能会填满屏幕;不确定。

来源

2012-08-10 15:56:54 user1590709

CSS Valign不同的文本行跨度

回答

相关问题