アブソリュートを使用せずにノーマルdivにスティッキdivをオーバーレイする

Question

スティッキdivを通常のdivの上に配置するにはどうすればよいですか？

私の要件は、ページの最初のdivが100%のwidthとheightをカバーする必要があることです。スクロール後、はtopになります。私がこれまで達成してきたことは、メニューがstickyのままであることですが、その後はdivのtopでなければなりません。これは可能ですか？

#container { 
 
    height: 100%; 
 
    background-color: blue; 
 
} 
 

 
#menu { 
 
    height: 80px; 
 
    width: 100%; 
 
    position: sticky; 
 
    background-color: green; 
 
    z-index: 10; 
 
    top: 0px; 
 
} 
 

 
#content { 
 
    height: 1500px; 
 
    background-color: gray; 
 
}

<div id="container"></div> 
 
<div id="menu"></div> 
 
<div id="content"></div>

Answer 1

#menu { 
    position: fixed; 
    top: 0; 
    left: 0; 
    right: 0; 
}