Html 为什么这个下拉列表中的文本在Firefox中没有垂直居中?
可能重复:Html 为什么这个下拉列表中的文本在Firefox中没有垂直居中?,html,css,firefox,Html,Css,Firefox,可能重复: 在此下拉列表中的文本在IE和Chrome中垂直居中…但在Firefox中没有垂直顶部对齐。如何在Firefox中居中而不中断其他浏览器 HTML 问题在于小提琴。他们的iframe只有最小的必要大小(至少在firefox中)。试试像这样的东西 div { height: 10em; display: table-cell; vertical-align: middle; } 并在周围放置一个。在实际场景中,您可能希望使用height:100%、绝对定位或仅
在此下拉列表中的文本在IE和Chrome中垂直居中…但在Firefox中没有垂直顶部对齐。如何在Firefox中居中而不中断其他浏览器 HTML
问题在于小提琴。他们的iframe只有最小的必要大小(至少在firefox中)。试试像这样的东西
div {
height: 10em;
display: table-cell;
vertical-align: middle;
}
并在
周围放置一个
。在实际场景中,您可能希望使用height:100%
、绝对定位或仅修改包含所选内容的任何标记的属性
首先误读你的问题,这里是水平对齐的答案
body {
text-align: center;
}
(或
上方的任何标记)
或者添加以下内容
margin-left:auto;
margin-right:auto;
但一般来说,为
正文设置一些值是一个好主意,以避免跨浏览器差异(例如,填充、边距和文本对齐)。处理此问题的最佳方法不是为选择指定高度,而是添加填充以匹配其他元素的高度。一开始误读。(水平与垂直…)更新了我的答案,包括垂直对齐。请查看此帖子。这也许能回答你的问题。实际原因是Firefox在forms.css中为select元素指定了“line height:normal!important”,这是无法覆盖的。hmm ok可能不是fiddles fault,但事实上,iframe
标记在不同浏览器中的行为不同。不过:在任何实际情况下,我的解决方案都应该有效。问题在于firefox中的实际文本。将左边距和右边距添加到“自动”不会解决此问题。尝试创建一个简单的
,并在firefox中打开HTML。您将看到它没有垂直居中。但是,它垂直居中于IE、Edge和Chrome中。不,这也会向下推下拉列表中的箭头。如果箭头溢出,效果会很好。。。
body {
text-align: center;
}
margin-left:auto;
margin-right:auto;