Mutlak konumlandırılmış öğeler içeren Clearfix

Question

Sorunum şu şekildedir:
Kenarlık, içeren öğeleri sarmıyor. Bunun nedeni, içerik öğesini mutlak olarak konumlandırıyorum, ancak düzenin çalışması için mutlak olmalarına ihtiyacım var. Bu aynı zamanda, clearfix çözümünü kullanamayacağım anlamına gelir (bu, bir seçeneği olmayan öğelerin yüzdüğü anlamına gelir).
Benim sorum şu ki, içerilen öğelerin yüksekliğini almak için ebeveyn div'u nasıl edinebilirim.

DÜZENLEME: Hayır JavaScript çözümü, CSS sadece

Html:

<div class="mask"> 
    <div id="content-1" class="content-item"> 
     Lorem ipsum dolor sit amet, consectetur adipisicing elit... 
    </div> 
    <div id="content-2" class="content-item"> 
     Lorem ipsum dolor sit amet, consectetur adipisicing elit... 
    </div> 
</div>​​​​ 

CSS:

.mask{ 
    position:relative; 
    width:800px; 
    border: 1px solid black; 

} 
.content-item{ 
    position: absolute; 
    width:300px; 
} 
#content-1{ 
    left:10px; 
} 
#content-2{ 
    left: 300px; 
} 

Answer 1

float:left bir tane öğe ayarlamak ve position:absolute; right:0 diğer bir clearfix kullanın.

Answer 2

Değişimiçin .content-item arasında ve bir float: left; verin. #content-1 ve #content-2'u kaldırın, artık onlara ihtiyacınız yok. Ve sonunda html'nize yeni bir sınıf ekleyin (2 #content kimliğinden sonra) ve stylescheet'inizdeki bu sınıfa clear: both; ekleyin.

Örnek: http://jsfiddle.net/skeurentjes/xLTJp/1/