0

次のコードは、両方のDIVを垂直に表示するのではなく、次々にブレンドします。両方ともに設定されており、どちらdisplay: blockのスタイル属性がこれらをこのように動作させるのか知りたいですか？！jsfiddleのデモを参照してください。

<div data-role="page">
    <div  data-role="content">
        <div>
            <a href="#" data-role="button" data-inline="true" data-mini="true" style="float: left">Do something</a>

            <span href="#" style="float: right; border-radius: 10px; background-color: white; padding: .6em">Something</span>
        </div>

        <div>
            <ul data-role="listview">
                <li><a href="#">Foo list entry</a></li>
            </ul>
        </div>
    </div>
</div>
4

1 に答える 1

0

フローティング要素を使用した後、 clear：bothスタイルを含む要素でそれらを閉じる必要があるため、コードの一部は次のようになります。

<div>
    <a href="#" data-role="button" data-inline="true" data-mini="true" style="float: left">Do something</a>

    <span href="#" style="float: right; border-radius: 10px; background-color: white; padding: .6em">Something</span>

    <div style="clear:both"></div>
</div>

これが動作中のJSFiddleです（マージンも少し変更されています）：http：//jsfiddle.net/Cw86p/9/

于 2012-07-22T21:13:11.333 に答える