3

Skeleton ボイラープレートを使用してレスポンシブ デザインを作成しています。

これは、ChromeとFirefoxでそれぞれどのように見えるかです

クロム: http://screensnapr.com/v/iaXYDS.jpg

Firefox: http://screensnapr.com/v/EW6HZM.jpg

ご覧のとおり、メニューであるはずの灰色のバーはクロムできれいに見えます。私が達成しようとしているのは、親内で比較的固定されているスティッキー メニューです。

#menu (灰色のバー) の CSS は次のとおりです。

#menu {
    z-index: 1000;
    background: #666;
    position: fixed;
}

Skeleton ボイラープレートを使用した #menu のクラスです。

<div id="menu" class="sixteen columns">

#menu にこれらの次のスタイルを与える

.container .sixteen.columns {
    width: 940px;
}

.container .column, .container .columns {
    float: left;
    display: inline;
    margin-left: 10px;
    margin-right: 10px;
}

この URL からテストできます

http://home.piratelufi.com/sticky/

ソースコードをダウンロードします(雑然としたファイルで申し訳ありません)

http://home.piratelufi.com/sticky/sticky.zip

4

1 に答える 1

3

cssdisplay : inlineで toを削除します

.container .column, .container .columns{
display:inline; // remove this line 
}

あなたが定義するから float:left;

于 2012-11-27T07:45:33.427 に答える