メニューの空白の設定 〜 paddingについて 〜

例: ice_2col_ver2とver3のメニューの位置の設定

スタイルシートの編集画面から以下のタグを探します。
ver2でもver3でも、上の方に書かれているので、見つけやすいと思います。


css：ice_2col_ver3

/* 枠設定====================================== */

　（略）

#left{　　←左部分のDIV（段落）のこと
margin: 0px;　←枠外の空白の設定
padding-top: 50px;　←枠内の空白の設定

width: 250px; ←　幅の指定
float: left;　←DIVを左寄せ
color: #ffffff;　←　DIV内の文字の色
}

「 padding-top: 50px;」　というタグで上からの空白（スペース）を設定しています。
[ padding（空白を設定するタグ）＋ top（上からの空白を設定するタグ） ]
　
ver2では、ここが150pxになっていると思います。
数字が大きければ大きいほど、上の空間（空白）が大きくなります。
逆に、ver2でメニューを上に上げたい場合は数字を減らせばOKです。




〜　paddingについて　〜


*１　
設定するタグとしては、padding-top以外にも、padding-left（左）・padding-right（右）・
padding-bottom（下）があります。「top」等が書いてない場合は以下の通りです。


*２
padding: 50px; →　上下左右に50pxの空間
padding: 50px 0px;　→　上下に50px、左右に0pxの空間
padding: 50px 0px 10px;　→　上に50px、左右に0px、下に10pxの空間
padding: 10px 20px 30px 50px;　左に10px、下に20px、左に30px、上に50pxの空間


↑ちなみに、この記述の仕方で「padding-top: 50px」を書こうとすると、
「 padding: 0px 0px 0px 50px; 」　となります。（ややこしい･･･



全体、もしくは上下＋左右などの場合は、*２の方が書きやすいけど、
一箇所だけを指定する場合は*1の方が絶対ラクです。
これはメニューに限りませんし、他のテンプレの場合でも使えるので覚えておくといいと思いますよ。




「margin」も「padding」も同じ空白のタグですが、意味が少し違ってきます。
marginは「枠外」のスペースなのに対し、paddingは「枠内」のスペースの設定タグです。
marginとpaddingの違いについては、また改めて記事にしたいと思います。