0

margin-top私は自分のを入れるのに混乱しましたdiv#q、それはまた影響しdiv#mます。

私はそれらを分離したいだけです。それらの間にスペースを空けて、上と下に配置しますdiv#m。div#q

私はこのアプローチを試しましたが失敗しました、誰かが私のコードについて提案がありますか？

私はこのhtmlを持っています：

<div id="m">
    <div id="c" style="background:red;">
        <h3>test 1 </h3>
        <ul>
            <li>asd</li>
            <li>asds</li>
            <li>asd</li>
        </ul>
    </div>
        <div id="c" style="background:blue;">
        <h3>test 2 </h3>
        <ul>
            <li>asd</li>
            <li>asds</li>
            <li>asd</li>
        </ul>
    </div>
    <div id="c" style="background:yellow;">
        <h3>test 3 </h3>
        <ul>
            <li>asd</li>
            <li>asds</li>
            <li>asd</li>
        </ul>
    </div>
    <div id="c" style="background:green;">
        <h3>test 4 </h3>
        <ul>
            <li>asd</li>
            <li>asds</li>
            <li>asd</li>
        </ul>
    </div>

</div>
<div id="q" style="background:violet;">
</div>

css：

#m{
    width :400px;
}
#c{
    width:33.33%;
    float : left;
}
#q{
    width: 300px;
    height : 200px;
    margin-top: 20px;
}
4

1 に答える 1

2

フロートをクリアします。たとえば-DEMOoverflow: hidden _

#m{
    width: 400px;
    overflow: hidden;
}

idまた、 -sは一意である必要があることを忘れないでください。同じスタイルを複数の要素に適用する必要がある場合は、class代わりに使用してください。

于 2012-12-16T14:16:48.113 に答える