WordPress ヘッダーとメニューバーの隙間

2016年11月21日

私のブログはソシムから発行している「WordPressレッスンブック」を参考にして一からテーマを作成しているんですが、本職が忙しくてしばらく開発が停止しておりました(笑)
一番解決したかったのがヘッダーとメニューバーに6px分の隙間ができてしまう!と言うもの。

ヘッダーとメニューバーの隙

cssの上ではどこをどう見てもその隙間ができる様な記述ありませんし、ほとほと困っていたわけなんですよ。

ググる事10数分

案外あっさり見つかりました(汗

どうも画像ファイルとテキストを並べた場合には意図せず段差が生じてしまう場合が多くあるそうです。

何とかかんとか以下の記述をcssに追加する事で解消する事ができました。

div#header img {vertical-align: bottom;}

vertical-alignでヘッダーの画像の縦位置を下端揃えに指定しました。

これでようやく隙間を埋める事ができました・・・。長い間放置した割には早めに解決できました。参考させて頂いたHPの管理人様に感謝です。

diary

Posted by mogu