web-dev-qa-db-ja.com

CSS:水平リストを中央に配置するにはどうすればよいですか?表示:インラインが機能しない

最も単純なコードを機能させるのに大きな問題があります。 cssの水平リストを中央に配置したいのですが、それだけです。

ここにリンク: http://bit.ly/LtIBai

私はこのコードを持っています:

#megaMenu.megaMenuHorizontal ul.megaMenu {
text-align: center;
 }

#megaMenu.megaMenuHorizontal ul.megaMenu > li {
display: inline;
}

それでもそれは中心になりませんか?

注:私が参照しているコードを表示するには、ウィンドウが「タブレットポートレート」サイズである必要があります。ロゴが中央に配置され、メニューが次の行に移動するとき、ただしモバイルメニューが表示される前の幅は約800pxです。

15
Rob Vanders

中央に配置することを拒否する理由は、それらも左に浮いているためです。変化する dislay: inlineからdisplay: inline-block; float: noneそしてそれらは中央に表示されます。

編集:そこにはたくさんの(ほとんど不要な)CSSコードがあるので、正しく見えるようになる前に他のいくつかのことを微調整する必要がありますが、少なくともフローティングが非センタリングの原因です。

32
powerbuoy