Bootstrap崩溃正在下一个Bootstrap崩溃标头上进行叠加

Question

所以今年我正在制作一个网站作为我的愿望清单。每个愿望都有一个可折叠的菜单（用Bootstrap崩溃制作），但有些东西是不对的。

图片中说明的问题：

正如您所看到的，它就像可折叠元素重叠或下一个面板的一部分应该触发下一个可折叠元素。

我已多次在代码中查找错误，但我真的无法弄清楚它为什么会这样做。

所以

<div id="collapseOne" class="collapse">

覆盖了

<a class="panel-link" role="button" data-toggle="collapse" href="#collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
  <div class="panel panel-default">
    <div class="panel-body">

我的所有代码都在Codepen here中。

我的网站是丹麦语：）

Answer 1

1）首先，您需要修复HTML标记的层次结构。哪个标签应该在另一个标签内？

deg_grp

2）Bootstrap的grid system涉及另外一个块的层次结构：容器包含行，行包含列。所以你需要将列包装成行。

请参阅demo on CodePen。