Html 使用css的全屏web布局问题 我有一个全屏网页布局，有两个“浮动”的文本框，它们大致位于屏幕中间。以下是框的css（除了页面上的垂直方向外，它们是相同的）：

在1920 x 1080的全屏上，它看起来非常好。箱子的尺寸设置为最小尺寸（1024 x 768），每侧都有空余空间。但是，当屏幕调整大小时，左侧会有大量死区，而右侧的框会离开屏幕

我不是css方面的专家，但我的印象是“左边距：25%”，无论浏览器窗口大小如何，都会保持屏幕边缘25%的边距

---

有人知道我该如何解决这个问题吗？

这将使方框居中，并在其周围保留较小的空白

body {
  margin-left: 75px;
  margin-right: 75px;
}
#home-box-1 {
  background: #aaa;
  margin-top:16%;
  margin-left:auto;
  margin-right: auto;
  max-width:850px;
  height:176px;
}

---

我误读了吗？这两个盒子的宽度都设置为850px还是其容器的宽度？有两个盒子（上面只列出一个），都是在850px处。因此，框是内容的容器，但在body标记之外没有框的容器（如果这有意义的话）

左边距

是父元素宽度的25%，在本例中为

。因此，当

body

的宽度为1024px时，它们距离左边缘的距离为256px，在1920px时，它们距离边缘的距离为480px。尝试将左右边距设置为

auto

。我试过了，仍然在做同样的事情：（假设你在1920x1080上观看（不幸的是，这是设计师设计的），全屏。然后你把它从全屏浮动浏览器窗口中拿出来。框确实重新定位了自己，但我觉得它们应该有25%的边距。也许我使用边距的方法错了……我只是想让这些框保持在屏幕中央，不管大小如何（只要不小于1024x768）作为旁注，@1024x768，盒子的每一面都应该有75-100px的空间，因为它们是设计好的。有没有办法去掉边距并使用不同的方法将它们居中？好的，这会有很大帮助。如果你只想让盒子保持居中，请将

左边距

更改为

左边距：自动；

并添加

页边距右侧：自动；

这样就可以了。对于侧面的额外空间，请尝试在

正文中添加
页边距左侧：75px；页边距右侧：75px
{

或盒子的父容器。Kyle是正确的。要将盒子置于

主体

的中心位置，请将它们的

左边距

和

右边距

设置为

自动

，并给它们一个

宽度

。css的一些其他方面都被搞砸了，但它们是可以调整的。这确实达到了预期的效果谢谢！！

body {
  margin-left: 75px;
  margin-right: 75px;
}
#home-box-1 {
  background: #aaa;
  margin-top:16%;
  margin-left:auto;
  margin-right: auto;
  max-width:850px;
  height:176px;
}