絶対位置のdivが

Question

が、私は今、この

<div id="container"> 
    <div id="div1"></div> 
<div> 

を持って隠されていない、のはそれを想定してみましょう：「コンテナ」は300ピクセル

「コンテナ」の幅を持っている

• はオーバーフローがあります。隠されました;
• 「div1」の幅は1000pxです。
• "div1"は絶対配置され、上：0px、左：0px。

問題：

「DIV1は」隠されていない、それは「コンテナ」をオーバーフローしたが、それはまだ:(見せて

私は単に「の位置：絶対」を削除した場合。それがします作品。

私は "DIV1" のオーバーフローを非表示にすることができますどのように

？

Answer 1

位置を追加：コンテナdiv要素に対して：

エクサ：

<style type="text/css"> 
     #container 
     { 
      width: 200px; 
      background-color: red; 
      height: 60px; 
      color: white; 
      position: relative; 
      overflow: hidden; 
     } 

     #div1 
     { 
      background-color: blue; 
      position: absolute; 
      top:0px; 
      left:0px; 
      width: 300px; 
     } 
    </style> 

<div id="container"> 
     <div id="div1">This is div1</div> 
    <div> 

Answer 2

#container { position: relative; } 

を追加

はオーバーフローを隠します。

Answer 3

の要素の絶対位置は、通常フローからその要素を削除します追加します。 相対位置に最も近い親に絶対位置を設定します。

「コンテナ」に「position：relative」を追加することで、目的の効果が得られるのはこのためです。