Javascript 如何在添加更多子项时自动更改div边框

我的标记如下所示：

<div class='faq_details'>
    <li class='faq_quest'>
        <a class='faq_row_question'>" + question</a>
    </li>
</div>

CSS代码：

.faq_details {
    position:relative;
    height: 30px;
    border: 1px solid;
    border-color: gainsboro;
    margin-right: -24px;
    padding-right: 17px;
    border-radius: 2px;
    padding-top: 12px;
}

正如你所看到的，每个问题都在一个边界内

我想在问题div的同一边框内单击时添加答案

---

我怎么办？有什么建议吗？

这是因为你在课堂上使用了固定高度。
您需要像下面这样使用最小高度：

.faq_details {
  position: relative;
  min-height: 30px; //Use min-height here
  border: 1px solid;
  border-color: gainsboro;
  margin-right: -24px;
  padding-right: 17px;
  border-radius: 2px;
  padding-top: 12px;
}

---

将高度更改为最小高度正确关闭

标签。

.faq_details {
  position: relative;
  min-height: 30px; //Use min-height here
  border: 1px solid;
  border-color: gainsboro;
  margin-right: -24px;
  padding-right: 17px;
  border-radius: 2px;
  padding-top: 12px;
}