jquery顯示/隱藏常見問題，文本覆蓋

Question

我正在使用一些jquery來顯示/隱藏網站上的問題的答案，但在文本的底部覆蓋了。我認爲這個問題與Jquery代碼是一致的，但我無法做出正面或反面的結論。請幫忙！

<script> 
 
$(document).ready(function() { 
 
$('.faq_question').click(function() { 
 
if ($(this).parent().is('.open')){ 
 
$(this).closest('.faq').find('.faq_answer_container').animate({'height':'0'},500); 
 
$(this).closest('.faq').removeClass('open'); 
 
}else{ 
 
var newHeight =$(this).closest('.faq').find('.faq_answer').height() +'px'; 
 
$(this).closest('.faq').find('.faq_answer_container').animate({'height':newHeight},500); 
 
$(this).closest('.faq').addClass('open'); 
 
} 
 
}); 
 
}); 
 
</script>

/*FAQS*/ 
 
.faq_question { 
 
\t margin: 0px; 
 
\t padding: 30px 0px 10px 0px; 
 
\t font-family: Century Gothic, CenturyGothic, AppleGothic, sans-serif; 
 
\t font-size: 18px; 
 
\t display: inline-block; 
 
\t cursor: pointer; 
 
\t font-weight: bold; 
 
    color: #666666; 
 
} 
 
.faq_answer_container { 
 
\t height: 0px; 
 
\t overflow: hidden; 
 
\t padding: 0px; 
 
\t font-family: Century Gothic, CenturyGothic, AppleGothic, sans-serif; 
 
\t font-size: 17px; 
 
\t line-height: 1.5em; 
 
\t text-align: justify; 
 
\t color: #666666; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
 
<h1>Why do I need Life Insurance?</h1> 
 
<div class="faq_container"> 
 
<div class="faq"> 
 
<div class="faq_question">To Protect Your Family: &#8609;</div> 
 
<div class="faq_answer_container"> 
 
<div class="faq_answer"> 
 
<ol> 
 
<li><strong>Provide income:</strong> Life insurance can’t replace you, but it can replace some or all of your income if you die. It can cover the cost of funeral expenses and help pay off debts, as well as day-to-day expenses, like food, clothing, and housing. For the longer term, life insurance can help pay for college tuition or ensure retirement dreams are realized.</li> 
 
<li><strong>Help with household needs:</strong> Think of all the work a stay-at-home parent provides. It’s invaluable, and insuring them is too. Life insurance can pay for vital household services like childcare, transportation and household chores.</li> 
 
<li><strong>Supply benefits you can use during your lifetime:</strong> If you choose whole life insurance, the cash value in your policy, the 「living benefits,」 can help pay for life’s events such as buying a home, a wedding, or educational expenses. As you pay the premiums of your whole life policy, the cash value builds and you can access those funds. Some important things to keep in mind, the cash value in a whole life insurance policy is accessed through policy loans, which accrue interest at the current rate. Loans will decrease the death benefit and cash value.</li> 
 
<li><strong>Leave a lasting legacy:</strong> Life insurance can create a financial legacy – funding the future and fueling dreams. From a favorite nonprofit to starting a scholarship program – the legacy you leave behind is all up to you.</li> 
 
</ol> 
 
</div> 
 
</div> 
 
</div> 
 
<div class="faq"> 
 
<div class="faq_question">Replacing Your Income: &#8609;</div> 
 
<div class="faq_answer_container"> 
 
<div class="faq_answer">Term life insurance is the most affordable way to replace your income if something happens to you. Men and women in excellent health in their mid-30’s and 40’s can buy $100,000+ of term life insurance for under a dollar a day. You can buy term life insurance for exactly the amount of protection you need, for exactly the time you need it. There is no greater feeling than knowing that your family will have sufficient income if something were to happen to you. Make sure that your family is taken care of, and get a <a href="get-personalized-quote.html">free quote</a> today.</div> 
 
</div> 
 
</div> 
 
</div> 
 
</div>

Answer 1

有一個保證金頂部和底部，該newheight不佔.faq_answer DIV列表元素上。

添加此樣式可修復該問題。

.faq_answer ol { margin: 0px; }