Firefox 忽略填充
我有这个 CSS 代码:
#tweet-container{
width: 290px;
height: 272px;
border: 1px solid #CCC;
color: #CCC;
font-size: 28px;
text-align: center;
letter-spacing: -2px;
min-height: 10px;
display: table-cell;
vertical-align: middle;
padding: 15px;
}
但 Firefox 似乎无法识别顶部和底部填充。 Safari 和 Chrome 都可以正常显示,甚至在 Firebug 中,当我添加 padding-top 时:它也不起作用。这就像它不是一个有效的声明或什么的。我有什么遗漏的吗?
I have this CSS code:
#tweet-container{
width: 290px;
height: 272px;
border: 1px solid #CCC;
color: #CCC;
font-size: 28px;
text-align: center;
letter-spacing: -2px;
min-height: 10px;
display: table-cell;
vertical-align: middle;
padding: 15px;
}
But firefox doesn't seem to recognize the top and bottom padding. Safari and Chrome both show it normally, and even in Firebug when I add padding-top: it doesn't work. Its like its not a valid statement or something. Is there something I'm missing?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
嗯,这有点有趣。您将宽度设置为 272px,但实际显示为 270px。您将高度设置为 290px,加上总共 30px 的内边距,实际显示的高度应该是 320px,但实际上是 318px。
玩了一下并取出显示:table-cell;似乎解决了这个问题。尽管由于某些原因填充不是均匀分布的,但它全部出现在底部。我认为将文本放在 ap 标签中,并给出 15px 的上边距已经完成了这项工作。
Humm, this is a bit interesting. You've set the width as 272px, but its actually displayed as 270px. You've set the height as 290px, with the 30px total of padding, the real displayed height should be 320px, but its actually 318px.
Had a little play and taking out display: table-cell; seems to sort the issue. Although the padding isn't spread equally for some reaosn, it all appears at the bottom. Putting the text in a p tag, and giving that a 15px top margin has done the job though I think.
您是否尝试添加
padding:15px!important;
?did you try adding
padding:15px!important;
?