0

これは、ドロップダウンを次のように表示したいものです。主要なcssは以下のとおりです。

"#nav .flyout > li { float:left; }

"#nav .flyout.fourCol { width:900px; }"

http://jsfiddle.net/t7esz/ (これは動作します)

しかし、「#nav .flyout.fourCol { width:auto; }」を設定すると、すべてのリスが互いに下に折りたたまれます。コンテナーの幅を明示的に設定しない限り、左にフロートしたり、インラインで表示したりしないようなものです。

http://jsfiddle.net/sumcA/2/ (これは機能しません。ここで width auto を使用できるようにしたいのです!)

4

1 に答える 1

0

次のようなことができます。

Css

.list { width: 980px; height: 39px; background-color: #878787; }
.list ul { list-style: none; margin: 0; padding: 0; }
.list ul li { 
    float: left; 
    padding: 10px; 
    font-size: 14px; 
    background-color: #3c3c3c; 
    margin-right: 5px;
}

Html

<div class="list">
    <ul>
        <li>One</li>
        <li>Two</li>
        <li>Three</li>
        <li>No width set</li>
    </ul>
</div>

次のようになります。

http://img36.imageshack.us/img36/2721/noautoulli.png
于 2012-04-12T20:05:25.590 に答える