0

これは私を壁に押し上げるCSSの質問です。以下は私が現在持っているコードであり、説明テキストを青いボックスの右側(つまりタイトルの下)に配置したいのですが、それを続けるには「ボタン」の下に配置します。さまざまな組み合わせを試しましたが、すべて現在の位置から開始するか、タイトルの下から開始しますが、幅によってインデントされています。

どんな助けでも大歓迎

<html>
    <head>
        <style>
            body { background-color: #fff; color: white; }
            .outer { width: 850px; height: 400px; background-color: #000; }
            .logo {float: left; width:150px;height:150px;background-color: #00f;}
            .button {float: right; height: 60px; width: 80px; background-color: #f00; }
            .title { font-size: 60px; float:left;}
            .desc {clear:both;}
        </style>
    </head>
    <body>
        <div class="outer">
            <div class="head">
                <div class="logo">oo</div>
                <div>
                    <div class="title">Title</div>
                    <div class="button">button</div>
                    <div class="desc">description text description text description text description text description text description text description text description text description text description text description text description text</div>
                </div>
            </div>
        </div>
    </body>
</html>

例

テキストは、上の画像の白いボックスがある場所にある必要があります。

4

1 に答える 1

1

さて、それは非常に単純なはずですよね?左に浮かせて幅を持たせるだけです...

デモ

CSS

.desc {
    float: left;
    width: 650px;
    padding: 10px;
}
于 2012-12-26T18:39:17.687 に答える