リストを下から上に展開する

Question

リストを下から上に展開しようとしています。それはうまくいきますが、リストが大きすぎる場合は、「上」のdivになります。私の考えは、リストが大きすぎるとき、私はスクロールバーと "bottom" divが "top" divの50％を持つようにします。私はそれをトップにすることはできません：0私はそれを行う場合、部門は上がる。 「ボトム」での高さの使用と同じです。私はなぜ今働いていないのか知っていますが、それを修正する方法はもうありません。どんなアイデアも参考になるでしょう。

https://plnkr.co/edit/0qZVy8PeZ6uUwejV1AFf?p=preview

.top { 
    position: relative; 
    height: 300px; 
    background-color:red; 
} 

.bottom { 
    position: absolute; 
    bottom:5px; 
    background-color:blue; 
} 

Answer 1

私はちょうどあなたの提供リンクを介して行っています。 .bottom

max-height:300px; 
overflow-y:auto; 

Answer 2

にこれらのプロパティを追加する.bottomのオフposition: absolute;を取り、その後、これは私が必要とする正確に何である