火狐忽略填充

我有這樣的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中添加填充頂部時也不會有效。它就像它不是一個有效的陳述或其他東西。有什麼我失蹤？

來源

2010-04-29 williamg

是否顯示：table-cell;尊重保證金？ – 2010-04-29 03:06:30

它似乎確實如此，因爲左側和右側填充像正常一樣工作。 – williamg 2010-04-29 03:07:53

它可能是周圍的內容是什麼導致問題...我們得到一個實時版本的鏈接（或使用http://pastebin.me/）我在Firefox的頁面上單獨嘗試了您的代碼，填充工作正常，所以它很可能是其他代碼引起的問題。 – 2010-04-29 03:28:14

恩，這有點兒有趣。您已將寬度設置爲272像素，但其實際顯示爲270像素。您已將高度設置爲290px，填充總計爲30px，實際顯示的高度應爲320px，但實際爲318px。

有點玩，取出顯示：table-cell;似乎排序的問題。雖然填充不是平均分佈的，但它都出現在底部。把文本放在一個p標籤中，儘管我認爲15px的上邊距已經完成了這項工作。

來源

2010-04-29 08:59:19 Tom

我使用的唯一真正原因是：表格單元格是用於垂直對齊具有未知高度的文本的功能。出於這個原因，我想盡量保持在那裏，但似乎它的麻煩製造者......可能不得不使用JavaScript解決方案。 – williamg 2010-04-29 21:35:51

是的，我的解決方案是一個5分鐘的黑客攻擊。垂直對齊的東西在後面總是很痛苦。至少你更接近於搞清楚它！ – Tom 2010-04-30 10:03:03

您嘗試加入padding:15px!important;嗎？

來源

2010-04-29 03:02:38

我沒有嘗試過，但它不能解決問題......謝謝。 – williamg 2010-04-29 03:03:55

火狐忽略填充

回答

相關問題