【Twenty Ten】サイト全体の余白などの変更

TwentyTenでは、以下の画像のようにヘッダー上部が余白があり、また背景部分の上部にも余白があるようにサイトが配置されていますが、それをstyle.cssを使い余白を無くした設定にします。

style.cssファイルでヘッダー上部の余白をなくすためにpaddingの値を変更します。
【変更前:style.css】

#header {
  padding: 30px 0 0 0;
}

【変更後:style.css】

#header {
  padding: 0;
}

変更後は以下の画像のようになります。

次に背景の上の部分の余白などを無くしますので、以下のように#wrapperのpaddingの値を0(ゼロ)にします。
【変更前:style.css】

#wrapper {
  background: #fff;
  margin-top: 20px;
  padding: 0 20px;
}

【変更後:style.css】

#wrapper {
  background: #fff;
  margin-top: 0px;
  padding: 0;
}

*margin-top: 0px;は削除でもいい。

【style.css変更後のサイト画像】

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です