div不住在jquery後的一行slideDown（）

Question

當一個div在頁面上時，我可以直接在div下面滑動div，但只要我在同一行上有兩個+，slideDown函數開始從下往上右側頂部。我曾嘗試將它們放在單獨的div中，但仍然存在與下面的小提琴相同的問題。

如果任何人都可以推動我正確的方向，將不勝感激。

HTML：

<div id="panel1" class="panel"> 

    <!-- start of toggle div --> 
    <div id="nena"> 
     <img src="../images/tshirt pictures/nena boys.jpg" /> 
      <p class="tshirtName"> sample text</p> 
       <p id="show"><span style="font-family:NimbusSanDCon; font-weight:bold; font-size: 2em;">+</span></p> 
    </div><!-- end of nena--> 

    <div id="below"> 
    <p class="itemDescription">basiq tee</p> 
    <p class="price">49.95</p> 
    <br /> 
    <p class="price"> sizes</p> 

    <select name="size"> 
    <option value="s">S</option> 
    <option value="m">M</option> 
    <option value="l">L</option> 
    <option value="xl">XL</option> 
</select><br /><br /> 


<p class="price"> colours</p> 

    <select name="size"> 
    <option value="red">Red</option> 
    <option value="blue">Blue</option> 
    <option value="white">White</option> 
    <option value="black">Black</option> 
</select> 

     <p id="hide"><span style="font-family:NimbusSanDCon; font-weight:bold; font-size: 2em;">-</span></p> 
    </div><!-- end of below div when shown--> 
    <!-- end of toggle div--> 

CSS：

#nena { 
    height: 160px; 
    width: 100px; 
    border:thin solid #DEDEDE ; 
    margin-left: 10px; 
    margin-right: 10px; 

float: left;} 

.tshirtName { 
    font-family: NimbusSanDCon; 
    font-weight: bold; 
    font-size: 1.2em; 
    padding-right: 5px; 
    text-align: center;} 


#below { 
    background-color: #F5F5F5; 
    width: 100px; 
    height: auto; 
    display: none; 
    padding: 5px; 
float: left;} 

#nena img { 
    width: 90px; 
    margin-top: 5px; 
    margin-left: 5px;} 

#show { 
    float: right; 
    margin-right: 5px; 
    } 

#hide { 
    float: right; 
    margin-right: 5px;} 

.itemDescription { 
    font-family:NimbusSanDCon; 
    font-weight: bold; 
    font-size: 1.3em; 
    color: #1c665b; 
    margin-left: 5px;} 

.price { 
    font-family: NimbusSanDCon; 
    font-weight: bold; 
    margin-left: 5px; 
    letter-spacing: .2em; 
} 

a { 
    color: black;} 

這裏是工作提琴：http://jsfiddle.net/jbX6p/1/

在此先感謝

Answer 1

這裏是你http://jsfiddle.net/jbX6p/2/更新的jsfiddle。您應該使用位置屬性以正確的方式放置元素。在這種情況下使用

.below{ 
    position:absolute; 
    /* then position it the way you want using margin property */ 
} 

而且你有幾個div的具有相同ID #nena，#below等等。你不能做到這一點，這是一個很大的錯誤。將其全部改爲類名。