上图是我网站过滤一些数据的HTML。我在此文本对齐中心线中有 2 个标签和 2 个选择。所有元素都显示为内联。一切都在 IE9 RC 和 Chrome 9 上完美运行。但它在 IE7 和 IE8 上不起作用,因为所有标签中的文本都显示在行的底部,如下图所示。
你有解决这个问题的 CSS 吗?您可以编辑我的 jsFiddle 来尝试解决这个问题。
http://www.jsfiddle.net/AaDkd/
更新#1 我尝试将所有相关元素的行高设置为当前行的高度。但它不适用于 IE7。
源代码:http://jsfiddle.net/AaDkd/1/
演示:http://fiddle.jshell.net/AaDkd/1/show/
更新#2
如您所见,我删除了所有样式的控件,但是当我使用 IE7 时,选择和标签中文本的垂直中心并不完全相等。这是因为选择的默认高度(在 IE7 中无法调整)和标签或跨度的高度不相等。
源代码:http://jsfiddle.net/AaDkd/5/
演示:http://fiddle.jshell.net/AaDkd/5/show/
附言。不要忘记此行的文本对齐是居中的。
谢谢,
最佳答案
查看您的示例,以下 CSS 适用于 IE8、FF、Chrome。
label, select, button {
vertical-align: middle;
}
更新: 我在 IE7 上检查过它,如果您不在选择上设置那些行高和高度,它工作正常。唯一的问题是您不能在 IE7 中更改选择的高度,这在我看来是这样。
UPDATE2:这是您的 Update#2 Fiddle 在 IE7 中为我显示的方式:
关于css - 如何设置标签或跨度等内联对象的垂直对齐方式在为 IE7-8 设置文本对齐等于中心的行中?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/5003667/