如何放置一個關於左下角的DIV？

我想在DIV中添加li s。這個DIV作爲現場組的框架沒有width，也沒有height。大小應該通過使用填充來自動調整大小。的問題是，DIV是一類的另一DIV的元素：如何放置一個關於左下角的DIV？

<div class="flag"> 
    <div id="drop_up"> 
     <fieldset> 
      <ul> 
       <li> 
       some content 
       </li> 
      </ul> 
     </fieldset> 
    </div> 
</div>

好的，所述li的將被通過一個循環自動插入。

現在的問題是，DIV是一個下拉框架。它的大小向上增長，而不是像往常一樣下降。所以我不能通過使用左側，底部等來定位，因爲高度將根據li的數量而不同。

我的問題是，如果有一種方法來定位一個元素左下角的角落？通常情況下，定位會在右上角生效，DIV向下增長時不會出現問題。

如果有人能幫助我，我真的很感激。

非常感謝。

來源

2013-05-08 bonny

對於一個好問題+1。我很難過，在使用flexbox之外，我想不出我會這樣做的方式。 – Michael 2013-05-08 15:42:16

你有充分的工作示範，我們可以玩一玩嗎？小提琴？ – jezzipin 2013-05-08 15:49:43

我會創建一個，請等一下。 – bonny 2013-05-08 15:50:20

如果我明白你想達到的目標，你希望'drop_up'div的底部始終附加到父'flag'div的頂部，即不管在'flag'中有多少內容，或'drop_up'。

假設我的理解是正確的，我會建議將'drop_up'div包裹在另一個div（我將稱之爲'drop_upHolder'）中，然後將這個新div絕對定位到'flag'div的頂部，然後絕對位置'drop_up'div這個持有者div的底部。

例如

<div class="flag">  
    <div id="drop_upHolder"> 
     <div id="drop_up"> 
      .... 
      .... 
     </div> 
    </div> 
</div> 

.flag #drop_upHolder { 
    position:absolute; 
    z-index:0; 
    top:0; 
    height:0 
} 
.flag #drop_up { 
    position: absolute; 
    z-index: 1; 
    background-color: gray; 
    padding: 25px; 
    bottom:0; 
}

我希望這有助於。

來源

2013-05-14 16:33:11 MarkP

驚人的...我將在稍後對它進行測試，但乍一看，它看起來像它會做我喜歡的工作。感謝迄今。 – bonny 2013-05-15 13:02:03

你好，我嘗試過，它的工作輝煌。非常感謝。 – bonny 2013-05-15 19:39:24

不客氣。 – MarkP 2013-05-16 12:15:19

如何放置一個關於左下角的DIV？

回答

相關問題