【jQuery】アコーディオンメニューで意図せず上に開く

■ 現象 —————————————————
・アコーディオンメニューで意図せず上に開いてしまう。
・閉じるときも同じで上から下に閉まる。
・display:noneをdisplay:blockを切り替えても同じ
・アコーディオンメニューで下基準で開く、閉じる。

■ 原因 —————————————————
・アコーディオンメニューが入っている外側の<div>タグ内にある、一番上のタグがposition:absolute;bottom:0;など下基準になっている。
==============
<div id=”main”>
<div class=”content”></div>
<div class=”accordion”>
<div class=”accordion_inner”>
<!– アコーディオンのコンテンツ開く場所 –>
</div>
<div class=”accordion_btn”>
<!– アコーディオンのボタン –>
<div>
<div>
</div>
==============
#main .content {
position:absolute;
bottom:0; ← これが原因
}
==============

■ 解決 —————————————————
position:absolute;bottom:0;を使っているタグは一番上にしない。
==============
<div id=”main”>
<div class=”accordion”>
<div class=”accordion_inner”>
<!– アコーディオンのコンテンツ開く場所 –>
</div>
<div class=”accordion_btn”>
<!– アコーディオンのボタン –>
<div>
<div>
<div class=”content”></div>
</div>
==============
margin-topなどでも下層タグの設定が反映されてしまうが同じように
下層のposition:abosolute;bottom:0;影響を受けて下側を基準に開く閉じるが行われてしまう。