web-dev-qa-db-ja.com

絶対位置とオーバーフローの非表示

2つのDIVがあり、一方が他方に埋め込まれています。外側のDIVが絶対に配置されていない場合、絶対に配置されている内側のDIVは、外側のDIVに隠れているオーバーフローには従いません（ example ）。

外側のDIVを絶対位置に設定せずに、内側のDIVを外側のDIVのオーバーフローに対応させる機会はありますか（完全なレイアウトを台無しにするため）。また、テーブルTD（ exmple ）から「成長」する必要があるため、内部DIVの相対位置はオプションではありません。

他のオプションはありますか？

htmlcsslayoutoverflowcss-position
115
Zardoz

外側<div>をposition: relativeに、内側<div>をposition: absoluteにします。それはあなたのために働くはずです。

254
shankhan

外部divのposition: relativeはどうですか？内側のものを隠す例では。また、上部または左側を指定しないため、レイアウト内で移動しません。

24
Tesserex

絶対配置された要素は、実際にrelative親、または最も近い見つかった相対親に関して配置されます。したがって、overflow: hiddenを含む要素は、relativeとabsoluteの間に位置する要素でなければなりません。

<div class="relative-parent">
  <div class="hiding-parent">
    <div class="child"></div>
  </div>
</div>

.relative-parent {
  position:relative;
}
.hiding-parent {
  overflow:hidden;
}
.child {
  position:absolute; 
}
5
Si7ius