Question

我有一个非常基本的CSS问题，有以下标记：

#content_container {
  background: none repeat scroll 0 0 #fff;
  min-height: 800px;
  margin: 10px auto 70px;
  width: 100%;
  background-color: #ddd;
  overflow: hidden;
}

在这个div中我有几个方框：

.box {
  width: 300px;
  height: 378px;
  background-color: #F2EBE0;
  float: left;
  margin-left: 50px;
  margin-top: 45px;
  padding: 15px;
  padding-top: 0px;
}

由于float，当我调整浏览器窗口大小时，框会中断。这非常有效。但我知道要做的是在div的右侧保留150px空格。因此，我尝试将padding-left: 150px添加到#content_container。但是相反，div表现得像以前一样，它给了我一个x滚动条，并为其添加了150px。

我的问题是，如何在浏览器的100％宽度内添加填充。为了更好地解释这个问题，我提出了Image

谢谢！

Answer 1

尝试使用
* { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }

在100％宽度的div中填充右边

1 个答案: