現在使用中のWordPressのテーマ「Twenty Twelve」を少しずついじるべく、悪戦苦闘中のおじさんローカルブロガー・小梅太郎です。
Twenty Twelveを適用すると、最上部に余白ができるのですが、これまで自分が利用してきたテーマにはあまりないパターンで馴染みがないんですよね。
ということで、この部分を削除するべく調べました。
まあ、分かっている方にはなんてことないのでしょうが、これは、スタイルシートを修正するといいようですね。
※当ブログは子テーマを作っているので、そちらのstyle.cssにコードを書き加えることになります。
ページ上部の余白を削除する
まずは、元の親テーマのstyle.cssで該当箇所を探すと,ここでしょうか。
body .site { padding: 0 40px; padding: 0 2.857142857rem; margin-top: 48px; margin-top: 3.428571429rem; margin-bottom: 48px; margin-bottom: 3.428571429rem; box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
ここの、margin-topを変更するといいのかな。
余白をなくすのであればここを0にするので、
/*最上部の余白を削除 */ body .site { margin-top: 0; }
これでいいと思います。結果は、
余白はなくなりました。
最下部の余白も0にするなら、
margin-bottom: 0;
の記述を追加するといいはずです(確認済みです)。
※上の単位で、14px=1remです。
こちらのサイトを参考にさせていただきました。ありがとうございました。
WordPress Twenty Twelveのページ上部のグレー部分を削除 |ウェブシュフ