Bootstrap 行在另一个之上

Question

我正在稍微扩展我的前端 css 技能，我试图实现以下目标：两个引导行重叠，但保持它们的响应式网格行为。对我来说完全陌生，不知道如何解决这个问题..

所以基本上我希望有两列并排（随着内容的进行不断重复），然后另一行与另一列重叠。这需要中间列（在图像的第 2 行）在所有红色列上可见。

我该怎么做？我当然想保留网格功能。

这是我为了更好地理解而制作的JS Fiddle。网格的行为并不像它应该的那样。我也不认为position: absolute对响应式网站有好处。

我希望我的问题足够清楚！提前致谢

Answer 1

绝对位置可以工作，但要确保它是全高的，并且容器是 position: relative;

{
  position: absolute;
  top: 0;
  left:0;
  z-index:1;
  bottom:0;
  right:0;
  height:100%;
}