Paragraf桌子，底侧有厚实的一面

Question

有了这里显示的代码，我得到了不同分辨率的浏览器中的奇怪块。我有点解决了解决方案，如果块开始取决于页面的分辨率和盒子中的东西的数量，那么我将它们填充到足以完美对齐的程度。但是我想要一个解决方案，使每个分辨率都能完美地工作。

会发生这种情况：http://prntscr.com/mec8r3

我只尝试了@//<path_to_A>，但没有用，我不知道该怎么办

<br>

完美的内容表，底部有str8行

Answer 1

我认为问题的很大一部分是当您使用浮点数时，该元素已从流程中删除。它周围的其他元素基本上会忽略它。尝试使用flexbox。此时，无论如何，您应该使用flexbox而不是float。 Here is a great guide for flexbox。并不是很清楚您想要什么，因此这里有一个Codepen并带有您想要的猜测。如果您想要其他东西，请留下您想要的外观模型。希望这会有所帮助。

.about{
  display: flex;
  flex-wrap: wrap;
}

.col-1{
  width: 100%;
  text-align: center;
  min-height: 80px;
  background: #283593;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
}

.col-3{
  background: #00ACC1;
  width: 33.333333%;
  text-align: center;
  min-height: 80px;
}