ここから本文です

メニューバーが中央に表示されません。(ホームページ)

pek********さん

2013/6/2719:27:20

メニューバーが中央に表示されません。(ホームページ)

#menu ul,#menu li { margin:auto;
padding:0;
width:200; }

#menu li {list-style:none;
float:left; }

#menu a { display:block;
margin:auto;
color:#ccc;
text-decoration:none;
background:url(_right.png) right top no-repeat; }

#menu a span { display:block;
text-align:center;
font-family:"メイリオ",Meiryo;
background:url(_left.png) left top no-repeat;
font:bold 18px/30px Arial/*, Helvetica, sans-serif*/;
padding:0 50px; }

#menu a:hover { background-position:right bottom;
text-decoration:underlin; }

#menu a:hover span { background-position:left bottom; }


試行錯誤してみましたが、横一列に並べたいのに、センターにもってこようとすると縦一列に並びます。

回答お願いします

閲覧数:
271
回答数:
1

違反報告

ベストアンサーに選ばれた回答

sit********さん

2013/6/2720:12:55

>pekachuluさん

>メニューバーが中央に表示されません。

id="menu" が付いた要素は他に何の指定もないdivか何かですか?

>センターにもってこようとすると縦一列に並びます。

#menu ul,#menu li { margin:auto;
padding:0;
width:200; }

ulとliが同じ幅だから。
li2個目はulの右端で折り返して下の行へ行く。

× width:200;
○ width:200px;


#menu ul { margin:auto;
padding:0;
width:800px ; /* liの合計を指定 */ }
#menu li { list-style:none;
float:left;
width:200px ; /* liの幅を指定 */ }

質問した人からのコメント

2013/6/27 21:01:18

感謝 ulとliを別々に設定しなおしたら見事に表示されました。
ありがとうございます。

この質問につけられたタグ

みんなで作る知恵袋 悩みや疑問、なんでも気軽にきいちゃおう!

Q&Aをキーワードで検索:

Yahoo! JAPANは、回答に記載された内容の信ぴょう性、正確性を保証しておりません。
お客様自身の責任と判断で、ご利用ください。
本文はここまでです このページの先頭へ

「追加する」ボタンを押してください。

閉じる

※知恵コレクションに追加された質問は選択されたID/ニックネームのMy知恵袋で確認できます。

不適切な投稿でないことを報告しました。

閉じる