css - 如何在 CSS 中为各种浏览器设置边距

Question

我经常查看代码，看到诸如“-moz 诸如此类的 CSS 规则，-webkit 诸如此类的 CSS 规则”之类的东西，并认为我需要在我的案例中做类似的事情。

我的页面http://scope-stage.scholastic.com/需要像在 firefox 中那样显示，但是当我在 Chrome 和 Safari 中查看时，它完全倒退了。在 Firefox 中，我无法获得我希望它们具有常规边距的边距，也就是说 - 我必须使用负整数作为边距。我该怎么做才能使所有浏览器的边距都相同？

这是我在其中一个 div 上的 CSS(我想我可以对其余部分应用任何答案)

     .colorScheme {background-color:#B9E9DA; width:500px; height: 340px; margin-top:-45px; padding:0;}

但是当你在FF之外的任何浏览器中查看它时，你会清楚地看到它的破损。

感谢您的关注和帮助。

Answer 1

我不是 100% 确定您必须对此进行测试，但我相信您可以按以下方式解决您的问题。

* {
 margin:0;
 padding:0;
}

.colorScheme {
background-color:#B9E9DA; 
width:500px; 
height: 340px; 
margin-top:-45px; 
padding:0;
}

这会将所有元素设置为没有填充或边距。让您控制对所有填充和边距使用 CSS。

或者，您可以只将硬编码分配给单个类，但您需要为每个边距/填充分配一个值，如下所示

.colorScheme {
background-color:#B9E9DA; 
width:500px; 
height: 340px; 
margin:-45px 0 0 0; 
padding:0;
}

试试看它们是否适合您。