将元素堆叠在容器内

Question

我在一个列表中有多个元素。我想将它们全部堆叠在一起。在它们上使用 position: absolute 取得了这个结果，但是我似乎无法弄清楚如何将它们保持在它们的网格 space 内（我正在使用 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/

将元素堆叠在容器内

Stack elements above each other inside a container

html

css

materialize