8

私の問題は次のとおりです
。ボーダーは、含まれているアイテムをラップしません。これは、コンテンツ項目を絶対位置に配置しているためだとわかっていますが、レイアウトが機能するには絶対位置にする必要があります。これは、clearfix ソリューションを使用できないことも意味します (これは、オプションではない要素をフロートする必要があることを意味します)。
私の質問は、親 div に含まれる要素の高さを取得する方法です。

編集: Javascript ソリューションなし、CSS のみ

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;
}

</p>

4

2 に答える 2

8

1 つの項目を に設定float:leftし、もう1 つの項目を に設定してposition:absolute; right:0、 を使用しclearfixます。

于 2013-02-04T07:25:24.187 に答える
1

を に変更し、をposition: absolute;付けます。と を削除します。もう必要ありません。最後に、新しいクラスを html に (2 つの ID の後に)挿入し、スタイルシートでそのクラスに a を追加します。.content-itemposition: relative;float: left;#content-1#content-2#contentclear: both;

例: http://jsfiddle.net/skeurentjes/xLTJp/1/

于 2012-11-02T11:13:51.613 に答える