スクロール可能なdiv要素内でCSS絶対位置を使用する方法 質問する

スクロール可能なdiv要素内でCSS絶対位置を使用する方法 質問する

次のようなHTMLコンテンツがあります。複数の要素(例:分割id = 1、2、3)の分割スクロール可能なコンテナ。

各要素では、親要素に関連する位置であるCSS位置「絶対」を使用する必要があります。分割(すなわち、クラス='アンカー')。

私が抱えている問題は、外側のコンテナをスクロールすると、分割絶対位置が移動された要素です。私が理解している「絶対」位置は、親の DIV 要素を基準に配置されるものです。外側のコンテナーをスクロールするときに、これらの「絶対」位置を移動させるにはどうすればよいですか?

<div style="overflow-y: scroll">
   <div>
      <div class="Anchor" id="one">
           <div style="position: absolute"> something </div>
           <div style="position: absolute"> something else </div>
      </div>
   </div>
   <div>
      <div class="Anchor" id="two">
           <div style="position: absolute"> something </div>
           <div style="position: absolute"> something else </div>
      </div>
   </div>
   <div>
      <div class="Anchor" id="three">
           <div style="position: absolute"> something </div>
           <div style="position: absolute"> something else </div>
      </div>
   </div>
</div>

ベストアンサー1

position: relative;子要素を親 div に応じて移動させるには、親 div を設定する必要があります。

static実際には、デフォルトの位置が使用されていない限り、親 div を任意のユーザー定義の位置に設定できます。

おすすめ記事