入口 > テンプレ - カスタマイズ > 入口メニューの幅を調整する

入口メニューの幅を調整する

入口メニューの項目の幅を増減したい場合は、以下のようにしてください。
テンプレスタイルシートのわりと初めの方、

/**以下、入口メニュープルダウン関係**/
 ・
 ・
ul.ulTop { float: left; list-style: none; overflow: hidden; padding: 0; margin: 0; line-height: 21px; text-align: center; width: 119px; zoom: 1; }
ul.ulTop li.liTop { float: left; width: 238px; /* ulTop×2 */ margin: -32767px -119px 0 0; }
ul.ulTop li.liTop a.aTop { position: relative; z-index: 50; display: block; float: left; width: 119px; margin-top: 32767px; }
ul.ulTop li.liTop a.aTop:hover,
 ・
 ・
ul.sub li { line-height: 21px; vertical-align: top; height: 21px; }
ul.sub li a { float: left; width: 119px; clear: left; /*background必須*/background: url(dm.png) left top no-repeat; position: relative; z-index: 500; }
 ・
 ・
/**以上、入口メニュープルダウン関係**/

4箇所のピンク背景部分を各項目の幅にしたい数値にし、ブルー背景部分をその2倍の数値にする。
あまり大きい数にするとレイアウトが崩れるのでご注意ください。また、単位「px」は変更しないでください。



以上です。
なお、デフォルトが中途半端な数なのは元々のソースが背景画像を置くスタイルになっていて、そちらをキリの良い数で作りやすくするためにそうなっていたのを私がそのまま使わせてもらっているだけなのであんまり気にしなくて大丈夫です。
2013-01-10