2

次のソリューションを使用して、内側の div (コーナー) を外側の div (ベース) の右上隅にフロートさせました。それはうまくいきます。

CSS:

#base {width: 100px; height: 100px;}
#corner {float: right; width: 40px; height: 40px; margin: 0 0 15px 15px;}

HTML:

<div id="base">
    <div id="corner">
        <!--stuff inside corner-->
    </div>
    <!--other stuff inside base-->
</div>

ここで、内側の div (コーナー) を外側の base-div (右下) の下部にフロートさせたいのですが、正しい CSS 構成が見つかりません。目標を達成するために何を変える必要がありますか?

ベース div のテキストがコーナー div をフロートさせることは非常に重要です (上記の例のように)。

4

2 に答える 2

2

コンテナを div にしposition: relativeます。次に、position: absolute「フロート」する div で使用し (ただし、使用する必要はありません)、ルールを 0floatに設定bottomします。right

http://jsfiddle.net/ExplosionPIlls/yWGTB/

于 2013-02-19T13:38:53.370 に答える
2

あなたのdivを配置してみてください

#base {
    width: 100px;
    height: 100px;
        /* positionning */
    position:relative;
}

#corner {
    /* float: right; */ /*floating will be useless */
    width: 40px;
    height: 40px;
    margin: 0 0 15px 15px;
        /* positionning */
    position:absolute;
    bottom:0;
    right:0;
}

ここで、外側の div コンテンツを内側の下部コーナー div の周りに配置する必要がある場合は、レイアウトを「トリック」して、内側の下部コーナーの下に空のスペースをシミュレートする必要があります。

詳細情報:

于 2013-02-19T13:40:12.543 に答える