0

Responsive Navを自分のサイトに統合しようとしていますが、目的のレイアウトを確立するのに苦労しています。

ここに JSFiddle を作成しました。「結果」パネルの幅を変更して、ナビゲーション バーがレスポンシブ ドロップダウン メニュー アイコンに折りたたまれるのを確認できます。実際のドロップダウン バーの機能は完璧です。ただし、私が抱えている問題は、メニューに折りたたまれていないときに、ナビゲーション リンクをヘッダーの横に浮かせようとすることです。したがって、リンクの (折りたたまれていない) リストをヘッダーの下に配置するのではなく、ヘッダーの横に配置したいのですが、スクリプトによってアイコンがアクティブになったときに下にドロップダウンします。

CSS は、私自身の組み合わせと、プラグインの開発者による例からのいくつかです。nav#primary ul最終的には、フロートをヘッダー (H1) に対して残しdisplay:blockてから、レスポンシブ ナビゲーション バーに折りたたむことを検討していると思います。

ここで助けてくれてありがとう。

4

1 に答える 1

1

これを試してください→ http://jsfiddle.net/matbloom/3DUj5/

これでうまくいくはずです:

nav#primary {
    float: right;
    width: 70%;
}

プレゼンテーションに合わせて #primary の幅を調整するだけで、準備完了です。

于 2013-09-06T02:41:47.110 に答える