html - 响应式布局的边距

Question

我很确定这很容易，但我很难过。

我正在从事响应式布局设计。无论页面大小，我总是希望左边有 10px 的边距，右边有 10px 的边距。我能够在左侧实现 10px 的边距，但我无法计算出右侧的边距。我将如何使用 css 执行此操作？我可以根据右侧需要多少空间来估算 % 宽度，但显然随着页面大小的缩放，此边距也会缩放。我如何始终保持边距合适？这是我的代码示例:

form {
width: 100%;
display: inline-block;
margin-left: 10px;
margin-right: 10px;
    }

'form' 位于 '#wrap' 和 '.left' 内，它们都应用了相同的 margin-right:

#wrap {
width: 95%;
margin-top: 0px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: auto;
-moz-box-shadow: 0 0 3px 3px #CCC;
-webkit-box-shadow: 0 0 3px 3px#CCC;
box-shadow: 0 0 3px 3px #CCC;
background-color: #fff;
display: inline-block;
text-align: center;
}

.left {
float: left;
text-align: left;
padding-right: 10px;
padding-left: 18px;
font-weight: lighter;
font-size: 12px;
color: #777777;
padding-top: 10px;
width: 100%;
margin-right: 10px;
}

Answer 1

这会产生魔力:

form {
  width: auto;
  display: block;
  margin-left: 10px;
  margin-right: 10px;
}