絶対配置されたコンテンツに合わせてdivを伸ばす

Question

これはCSSとスクリプトなしで行う方法はありますか？私は最小幅のdivを持っており、内部は可変幅の動的に生成された内容を持つ絶対的に配置された内部divです。コンテンツがdivを超えている場合もありますが、絶対的に配置されているのでdivを引き伸ばすことはありません。どのように私はそれを含むdivをストレッチするのですか？ありがとう

Answer 1

私はこのJSfiddleを参照してみてください。 http://jsfiddle.net/gA7mB/ 私がそれを正しく読むと、それは基本的にあなたが探しているものです。

HTML

<div class="container" > 
<div class="relative" > 
    <div class="absolute" > 

     <h1>I am Content i can be as long as you wish. t is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English. Many desktop publishing packages and web page editors now use Lorem Ipsum as their default model text, and a search for 'lorem ipsum' will uncover many web sites still in their infancy. Various versions have evolved over the years, sometimes by accident, sometimes on purpose (injected humour and the like).</h1> 

    </div> 
</div> 

CSS

.container{ 
    width: 500px;    
} 

.relative{ 
    position: relative; 
    background: #666; 
    min-width: 200px; 
    min-height: 200px; 
} 

.absolute{ 
    position: absolute; 
    background: #999; 
    top: 20px; //not important, just to show absolute position 
    left: 20px; //not important, just to show absolute position  
} 

Answer 2

コンテンツ要素がposition: absoluteを持っている場合、それは不可能です。ただし、絶対配置を避けることもできますが、代わりに浮動要素を使用して目的の結果を得ることもできます。例としてthis answerからvery similar questionを参照してください。