为流体布局强制实施“最小边距”

Question

我正在尝试建立一个在相当高分辨率下效果最佳的网站，但在分辨率降低时尽可能向左滑动。

我甚至不确定要在此处复制哪些代码，因此链接为：

projects.thomasrandolph.info

我需要的是#page左侧停止在#logo右侧向左滑动加上几个像素。它位于页面左侧13.25em。

我已将#page的左边距设置为13.25em，这看起来是正确的，但是在更高的分辨率下，页面看起来很奇怪，因为它没有居中。我想保持对中，但也要在某一点停止滑动。

所以我希望左侧不要远离这个：

我绝对会更喜欢如果我可以在我在这里注意到的两个元素上使用纯CSS来做这个，但我可以根据需要添加HTML。

我一直在努力解决这个问题，所以请问我问题，或者编辑这个问题以提高问题的清晰度。

更新

以下是当前如何看待两种分辨率的图像：

1920

1280

以下是 应如何查看大约1540以下分辨率的图片：

任何高于〜1540的分辨率都会顺畅地向右滑动，就像现在一样。

Answer 1

我最后做的是在#page周围添加一个包装器。这不是我想要的完美世界，但我希望min-margin在一个完美的世界（或至少margin: min()）！

在包装器上，我应用了margin: 0 13.25em; 13.25em我想要的地方#page停止向左滑动。双方的相等边距使#page居中，而13.25em向右移动。因为我使用边距而不是填充，右侧可能会溢出浏览器而不会导致水平滚动条出现。

这似乎是一个很好的解决方案。我原本一直在寻找更“聪明”的东西而不添加HTML，但这很简单，看起来很有效，看起来非常值得额外加价。

Answer 2

如果您没有为元素使用边框，则可以使用它来定义＆＃34; min-margin＆＃34;。

.center
{
margin: 0px auto;
border: transparent solid 30px;
}

P.S。我知道这是一个老问题，但OP也在本月发表了评论。

Answer 3

准确的宽度和高度到班级中心。然后将位置设置为绝对：假设我们想要设置宽度：400px;和身高：300px;尝试下面的代码片段

.center
{
postion:absolute;
width:400px;
height:300px;
top:50%;
left:50%;
margin-top:-200px;
margin-left:-150px;
}