在容器内堆叠元素彼此之上

Question

我在列表中有多个元素。我想将它们全部堆叠在一起。在他们身上使用position: absolute取得了这个结果，但我似乎无法弄清楚如何将它们保留在网格空间内（我正在使用Materialize grid system）。我尝试使用position: relative添加包装器，但我无法使其工作。

http://jsfiddle.net/b6naew9h/12/

如何堆叠所有列表元素并仍然尊重网格？

Answer 1

您可以将li的包含元素设置为position：relative，就像响应项（或其中的其他元素），然后将li设置为position：absolute。

.rel {position:relative;} // this could be on .col or a new element inside it
li {
  position: absolute;
  top: 0;
  left: 0;
  width:100%;
}

http://jsfiddle.net/nft3mvj6/