Html div之间的动态空间

所以我得到了一个Div，它的宽度设置为100%宽度，这意味着它可以是任何大小。该div的值minwidth:950px，因此其宽度大小不能小于950

在该div中，我有2行，每行包含4个div-具有特定的宽度值

现在发生的事情是，当一个低分辨率的人进入我的网站时，他可以看到4个div聚在一起很好：

但当有人以高分辨率进入我的网站时，它是这样的：

我想做的是，当有高分辨率的人进入我的网站时，4个div会占用彼此相同的空间，所以看起来是这样的：

我该怎么做？提前谢谢

CSS样式 HTML元素 Codepen沙盒：

原创文章：

CSS样式 HTML元素 Codepen沙盒：

---

原创文章：

嘿，我刚回家，很抱歉耽搁了这么久。。不管怎样，这很好，但我不明白一件事，当你把文本添加到四个盒子中的一个盒子时，这个盒子会变得一团糟，尽管如果所有四个盒子都有文本，看看这个：，你怎么解释它呢？作为记录，这并不像上面所示那样有效。然而，链接的原始文章确实如此。不同之处在于原文使用了固定高度。。上面显示的代码不正确，也不能正常工作。嘿，我刚回家，很抱歉耽搁了这么长时间。。不管怎样，这很好，但我不明白一件事，当你把文本添加到四个盒子中的一个盒子时，这个盒子会变得一团糟，尽管如果所有四个盒子都有文本，看看这个：，你怎么解释它呢？作为记录，这并不像上面所示那样有效。然而，链接的原始文章确实如此。不同之处在于原文使用了固定高度。。上面显示的代码不正确，并且不能正常工作。

#container {
  text-align: justify;
  min-width: 950px;
  border: solid 1px Black; // Change this
}

#container div {
  width: 100px; //Change this
  display: inline-block;
  background: red; // Change this
}

#container:after {
  width: 100%;
  display: inline-block;
}

<div id="container">
  <div></div>
  <div></div>
  <div></div>
  <div></div>
</div>