CSS：两个相同的元素在两个不同的网站上显示不同

Question

在development site上，我正确设置了一些社交窗口小部件。

我无法在production site上复制此内容，即使我确定我使用相同的CSS。

li.twitter-balloon上的填充底部与li.linkedin-balloon的填充顶部重叠。为什么会在生产站点上而不是在开发站点上发生？感谢。

Answer 1

我认为您使用的CSS并不完全相同。

在您的生产网站上，在style.css文件的第294行（或具有相同内容的其他行号）中，您有margin-bottom:-10px;，这就是它们不同的原因。如果删除此行，它们看起来会一样。

Answer 2

在开发服务器上你的css是

.twitter-balloon {
    background: url("images/twitter-balloon.png") no-repeat scroll right 15px rgba(0, 0, 0, 0);
    border-top: 1px dotted #D8D8D8;
    padding: 20px 0;
}

on live it：

.twitter-balloon {
    background: url("images/twitter-balloon.png") no-repeat scroll right 15px rgba(0, 0, 0, 0);
    border-top: 1px dotted #D8D8D8;
    display: block;
    margin-bottom: -10px;
    overflow: auto;
    padding: 20px 0;
} 

只需删除边距