使用 CSS (Firefox) 缩小时如何使整个网站与顶部对齐？

Question

我已使用 CSS 缩放属性将网站缩小约 95%（用于响应目的）。

html, body {
  -moz-transform: scale(0.95, 0.95); 
  zoom: 0.95;
  zoom: 95%; 
}

但是，当我对 Firefox 使用 -moz-transform 属性时，网站会对齐到中间，因此顶部有一个巨大的差距，网站缩小得越多。

当我在浏览器上使用 cmd + 'scroll down' 进行手动缩小时，它会缩小并且网站仍然与顶部对齐。

事情是这样的：

这是我希望发生的事情：

Answer 1

我找到了实际上非常简单的答案。

只需要将这个添加到正文中 / html css:

-moz-transform-origin: 50% 0;

以防有人觉得这有帮助。

Answer 2

是这样的吗？

html {
  height:900px;
  padding:0;
  margin:0;
  height:900px;
  width:100%;
  background: #A2D0D0;
}


#website-container {
  width:950px;
  height:400px;
  position: fixed;
  top:0;
  left:0;
  right:0;
  margin-left:auto;
  margin-right:auto;
  background: #77A7F9;
}

<body>
<div id="website-container">
Main Website
</div>
</body>

Link: https://jsfiddle.net/gez2ozj5/

使用 CSS (Firefox) 缩小时如何使整个网站与顶部对齐？

How to keep the entire website aligned to the top when zooming-out using CSS (Firefox)?

css

firefox

viewport

zooming