1

ナビゲーションに使用している順序付けられていないリストを中央に配置するのに問題がありました。私は他のアドバイスを見て、それを修正しようとしたので、今私のコードは混乱しています。何がうまくいかないのか、一生わからない。私が試したすべての解決策は、まだリストをウィンドウの中央に配置していません。overflow:visable を追加すると引き伸ばされますが、100% ではなく、ウィンドウが大きくなっても拡大しません。

#navbar {
position: fixed;
top:-17px;
margin-bottom: 10px;
font-family:Verdana, Geneva, sans-serif;
margin: 0;
padding: 0;

}

#navbar ul > li {
display: inline-block; 
float: none;
color:white;
font-size: 14px;
margin-right: 35px;
margin-left: 35px;
padding: .2em 1em;
overflow:visible;

}

4

5 に答える 5

2

これはあなたが探しているものですか？

http://jsfiddle.net/talymo/6FGbw/

#navbar {
    position:fixed;
    list-style:none;
    margin:0;
    padding:0;
    width:100%;
    text-align:center;
}

    #navbar li{
        padding:10px;
        display:inline-block;
    }

    <ul id="navbar">
        <li>Thing 1</li>
        <li>Thing 2</li>
        <li>Thing 3</li>
    </ul>
于 2013-04-05T13:44:40.717 に答える
1

試すことができることの 1 つは、リストを div 内に配置し、スタイルtext-align:center;を div に追加することです。

その後、position:fixed;からスタイルを削除するだけ#navbarです。

<center> </center>または、リストをタグでラップすることもできます。

お役に立てれば ：）

于 2013-04-05T13:40:22.733 に答える
1

試す：

#navbar ul {
text-align: center;
}

JSFiddle: http://jsfiddle.net/zgwxP/

于 2013-04-05T13:40:47.983 に答える
1

ナビゲーションバーに使用できる幅が設定されていると仮定するとtext-align:center、ul

jsフィドル

/* Give the navbar a width */
#navbar {
    left:0;
    right:0;
}

#navbar ul {
    padding:0;
    text-align:center;
}
于 2013-04-05T13:41:42.530 に答える