Question

我的标记看起来像这样：

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

我从XML文件中读取问题并以HTML格式显示。现在，我想在点击时为每个问题添加答案代码是：

$(".faq_row_question").click(function () {
    var answer = xml.find('row').eq(0).find('answer').text();
    $(this).append( answer );     
});

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的同一边框内点击时添加答案。

我该如何管理它？有什么建议吗？

Answer 1

这是因为你正在为你的班级使用修正高度你需要使用像下面这样的最小高度：

.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;
}

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

1 个答案: