1

Xhtml Strict 1.0 と Css で苦労しています。そして、私はほとんど解決策がありません。

マイサイト URL: http://www.pro-turk.net/beta/

サイト用に jquery マルチレベル ドロップダウン メニューを作成しました。

問題ないように見えますが、css 2.1 の一部であり、一部のブラウザー (ie6 および ie7 を含む) でサポートされていないナビゲーション メニューの css 表示属性の inline-block プロパティを使用しました。

#nav > li 要素をブロック レベルの要素にしたいのですが、これを行い、すべてを同じ行に配置するには、 #nav > li で float を使用するしかありません。しかし、私はそれらを親 (メニューバー) の中央に配置したいと考えています。だから私は float:center のようなものが必要です (私はそれがかなり愚かで存在しないことを知っています)。しかし、改行なしでブロックレベル要素を子要素として含める方法はありますか(つまり、ブロックレベル要素を作成せずに)。

よろしく。

4

3 に答える 3

0

テーブルを使わずにcss2で解決策はないと思います。

于 2010-04-06T09:08:56.557 に答える
0

li左または右にフロートを作成し、メニュー自体を中央に配置できます。メニューをその要素の合計の幅にします。

#nav
{
    width: 500px;

    /* This will center the block within its container */
    margin-left: auto;
    margin-right: auto;
}

編集: メニューの幅がわからないので (これは動的です)、テーブルに代わるものがないというまさにそのケースに直面しています。

<table border="0" cellpadding="0" cellspacing="0" style="margin: 0 auto;">
    <tr>
        <td>Menu item 1</td>
        <td>Menu item 2</td>
        <td>Menu item 3</td>
    <tr>
<table>

PS などの新しい CSS3 拡張機能を使用したテーブルの代替がいくつかありますがdisplay:table | table-cell、まだ広くサポートされていません。

于 2010-04-06T08:55:24.243 に答える
0

display:inline-block は IE6 または IE7 ではサポートされていませんが、display:inline を使用し、たとえば zoom:1 を使用して、これらの要素に hasLayout が設定されていることを確認することで、これらのブラウザーで同じ効果を得ることができます。条件付きコメントを使用して、異なる CSS をそれらのブラウザーのみに送信します。

于 2010-04-06T13:01:32.947 に答える