親要素の終わりでスティッキー要素を停止する方法

Question

コンテンツ列とスティッキーサイドバーを持つレイアウトがあります。ページを下にスクロールするコンテンツ列の最後にサイドバーを停止する必要があります。ここで

私が使用しているHTMLとCSS：私が間違っているhttps://codepen.io/anon/pen/awNorj

にも

<div class="container"> 
    <div class="content">Content</div> 
    <div class="sidebar">Sidebar (sticky)</div> 
    <div style="clear:both"></div> 
</div> 


.content{ 
    float: right; 
    width: 80%; 
    margin-left: 20%; 
} 

.sidebar { 
    float: left; 
    width: 20%; 
    position: -webkit-sticky; 
    position: sticky; 
    bottom: 30px; 
} 

を？

Answer 1

あなたの要素を試してみてください：

position: absolute;