
今回はMT(MovableType・MTOS)のプチカスタマイズ:ヘッダーの余白を小さくする方法です。
川中経営のHPはMT(MovableType)を使用していますが、まだまだ自分で一から構築は出来ないので、標準テンプレートをいじって、もとい、カスタマイズして、使っています。
が、標準では上の画像のように、ヘッダーの高さをかなりとっています。
まあ、カラフルなイラストを配置するデザインなので仕方ないのですが、イラストを青空に変更した身にはちょっと間延びしすぎです。
(それに、説明文の文字の大きさも小さいし・・・)
そんなわけで、
青空の上の部分を無くして、ヘッダーの高さを低くすることとしました。

こちらがカスタマイズ後のヘッダー。
どうです、ちょっとすっきりしたでしょ(^^)v
変更箇所は、ファイル『screen.css』の一部です。
『screen.css』は、./mt-static/themes/kawanaka/screen.cssに有ります。(人によって異なりますよ。)
#header-content {
width: 844px;
min-height: 72px;
margin: 20px 0 50px 20px; <<== 100pxを50pxに変更
}
これで、すっきり。
最初は、なかなか気づきませんでした。
違うだろうな・・・と思いながら修正したら、ビンゴ(^^)b
試行錯誤法は大事ですね。
(次は、青空の高さを低くして、もっとすっきりにチャレンジです。)
税理士法人川中経営
税理士・ITC 川中重司
MTのプチカスタマイズ:ヘッダーの余白を小さくする