「浮動」到父DIV底部的DIV不工作。 （使用Pos：rel，Bottom 0等）

Question

試圖讓一個DIV「浮動」到div的底部它的英寸我有位置設置爲相對父div和kid，並且底部爲0在孩子身上;但它仍然處於中間的頂端。

父DIV：

.detailsContainer 
{ 
    width: 100%; 
    height: 30%; 
    overflow: hidden; 
    position: relative; 
    background-color: blue; 
} 

兒童DIV

.obutton 
{ 
    text-align: center; 
    font-weight: bold; 
    width: 80%; 
    height: 29px; 
    background:rgba(204,204,204,0); 
    position:relative; 
    bottom: 0;  
    display: inline-block; 
    color: #666; 
} 

當前實際設置：

      <div class="detailsContainer"> 

           <a href="javascript:unhide(\'BookDetails'.$row->BookID.'\');"> 
           <div class="detailview"><b>Book Details<br></a></div> 

             <div id="BookDetails'.$row->BookID.'" class="hidden"> 
              <table> 
              <tr><td>Total Stock </td><td>'.$row->TotalStock.'</td> 
              <td>Current Stock</td><td>'.$row->CurrentStock.'</td></tr> 
              <tr><td>Awards </td><td>'.$row->Awards.'</td> 
              <td>Film</td><td>'.$row->Film.'</td></tr> 
              </table> 
             </div> 

         ';?> 


           <br><center><a href = "javascript:void(0)" 
           onclick = "document.getElementById('light').style.display='block';document.getElementById('fade').style.display='block'"> 
           <div class= "obutton feature2">Reserve Book</div></a></center>         
           <div id="light2" class="white_content"></div> 
           <div id="fade" class="black_overlay"></div>     
          </div> 

它的種類很多張貼這一點，但要確保沒有干擾你們可能會發現。它跳出了PHP的底部，如果您認爲問題可能在其他地方，我會發布整篇文章。

我試圖做一個jsfiddle它，但有太多的PHP和變量，到時候我解開了它，它只是2個普通的div，失去了它的唯一性，這個問題可能會被刪除。

感謝-Tom

Answer 1

.obutton位置需要是絕對的......對於底部的工作你打算的方式。