Google Chrome 中的边距和宽度问题

Question

我正在设置我的 div 的 margin 和 width，所有 margin 和 width 在 Firefox 和 Internet Explorer 中都可以正常显示。但是，谷歌浏览器无法正常工作。 如果我在 Chrome 中检查页面并调整我的margin，那么它会显示效果，但如果我更新我的 CSS，它就不起作用。

我也在使用-webkit-margin-start: 44px;，但没有任何效果。

我的 CSS 如下：-

#main {
  position:relative;
  width:1200px !important;
  min-height:800px;
  margin:44px auto;
  top: 7px;
  left: 2px;
  -webkit-margin-start: 44px;             
}

任何建议，如果我声明保证金，它也不适用于@media screen and (-webkit-min-device-pixel-ratio:0) { ...

屏幕截图如下：- 铬

对于火狐

提前致谢。

chrome 版本：62.0.3202.62

Answer 1

正如我在评论中所说，您使用 margin:44px auto 表示 margin-top:44px margin-right:auto margin-bottom:44px margin-left:auto 。但是-webkit-margin-start:44px指的是margin-left

margin-top 是 -webkit-margin-before。但这主要是指文本边距，它取决于写作模式、方向和文本方向，如您在此处看到的 margin dev moz 或者您可以搜索类似的问题

您的代码似乎可以工作（见下面的 sn-p）。我看到的唯一问题是您使用位置和边距。 （上，左+边距）。我建议你要么使用位置要么边距。例如，不要使用top:7px，而是使用margin:51px auto 44px（如果你想保持下边距为44px）。

没有您的代码，我们无能为力。如果问题仍然存在，请添加一个可以复制您的问题的有效 sn-p

如前所述，我将webkit-margin-start 下方的代码更改为webkit-margin-before

#main {
  position:relative;
  width:1200px !important;
  min-height:800px;
  margin:44px auto;
  top: 7px;
  left: 2px;
  -webkit-margin-before: 44px;     
  background:red;
}
body { margin:0}

<div id="main">

</div>