'Pure CSS Accordion'通过Filter Menu自动关闭

Question

可以在此处找到纯CSS手风琴：https://codepen.io/raubaca/pen/PZzpVe

我的问题可在此网址上看到： http://prj.sellerdeckwebhosting.co.uk/ks/smr/acatalog/trade-essentials-column-radiators-1.html

问题是，如果您展开侧边栏菜单，例如“高度（mm）”并勾选一个选项，则选项将消失，这就是问题。

.filter-list .tab {
  position: relative;
  margin-bottom: 1px;
  width: 100%;
  overflow: hidden;
}

.filter-header {
  color: #333;
}

input.filter-head-cb {
  position: absolute;
  opacity: 0;
  z-index: -1;
}

.filter-header>label {
  position: relative;
  display: block;
  padding: 0 0 0 3em;
  background: #f6f6f6;
  font-weight: bold;
  line-height: 3;
  cursor: pointer;
  border: solid 1px #ddd;
}

.filter-list .blue label {
  background: #2980b9;
}

.filter-list .tab-content {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height .35s;
  -o-transition: max-height .35s;
  transition: max-height .35s;
}

.tab-content p {}


/* :checked */

input.filter-head-cb:checked+.tab-content {
  max-height: 100%;
}


/* Icon */

.filter-header>label::after {
  position: absolute;
  left: 0;
  top: 0;
  display: block;
  width: 3em;
  height: 3em;
  line-height: 3;
  text-align: center;
  -webkit-transition: all .35s;
  -o-transition: all .35s;
  transition: all .35s;
}

.filter-header>input[type=checkbox]+label::after {
  content: "+";
}

.filter-header>input[type=radio]+label::after {
  content: "\25BC";
}

.filter-header>input[type=checkbox]:checked+label::after {
  transform: rotate(315deg);
}

.filter-header>filter-head-cb[type=radio]:checked+label::after {
  transform: rotateX(180deg);
}

.filter-list {
  margin-top: 10px;
}

.clear-button {
  position: absolute;
  top: 12px;
  right: 6px;
}

.filter-checkboxes {
  padding-top: 5px;
  padding-left: 5px;
  padding-right: 5px;
}

<div class="filter-list">
  <h4 class="filter-header" id="S_1_66439_0">
    <label for="tab_S_1_66439_0">Height (mm)</label>
    <input class="filter-head-cb" id="tab_S_1_66439_0" type="checkbox" name="tabs" onclick="OnFilter(this);">
    <div id="FilterPropertyOptions_S_1_66439_0" class="filter-checkboxes tab-content">
      <div id="PropOptionTemplate_S_1_66439_0" style="display:none;"><input type="checkbox" value="<Actinic:FilterPropValue></Actinic:FilterPropValue>" id="<Actinic:FilterPropChoiceID></Actinic:FilterPropChoiceID>" actiniccustomselection="" actinicdisabledctrl="" onclick="OnFilter(this);">
        <label for="<Actinic:FilterPropChoiceID></Actinic:FilterPropChoiceID>" actinicdisabledstyle=""><actinic:filterproptext></actinic:filterproptext></label><br></div>
      <input type="checkbox" name="S_1_66439_0" value="300" id="S_1_66439_0-2" disabled="disabled" onclick="OnFilter(this);">
      <label for="S_1_66439_0-2" style="color:gray">300 (0)</label><br>
      <input type="checkbox" name="S_1_66439_0" value="500" id="S_1_66439_0-3" onclick="OnFilter(this);">
      <label for="S_1_66439_0-3">500 (19)</label><br><input type="checkbox" name="S_1_66439_0" value="600" id="S_1_66439_0-4" onclick="OnFilter(this);">
      <label for="S_1_66439_0-4">600 (17)</label><br><input type="checkbox" name="S_1_66439_0" value="750" id="S_1_66439_0-5" disabled="disabled" onclick="OnFilter(this);">
      <label for="S_1_66439_0-5" style="color:gray">750 (0)</label><br><input type="checkbox" name="S_1_66439_0" value="1800" id="S_1_66439_0-6" disabled="disabled" onclick="OnFilter(this);"><label for="S_1_66439_0-6" style="color:gray">1800 (0)</label><br></div>
  </h4>
</div>