LION MEDIAの記事上部の隙間を無くす方法

ライオンメディアの記事の上部って何だか微妙な隙間・空白がありませんか?

本当に微妙な隙間で...SNSアイコンが表示される部分なんですが、SNSアイコンがあっても無くても、上からコンテンツまで微妙な隙間・空白が開いてしまいます。なんでこんなのあるんだろうと思い、隙間をCSSカスタマイズで消してみました。

カスタマイズといっても、すごく簡単に隙間を消すことができます。それではやり方を下記で説明しますね。

追加CSSで隙間を無くす方法

追加CSSを記述してあげると

こんなふうに、隙間が無くなりました。

追加したCSSコードはコレです。

/*記事上部の隙間*/
.content{
	margin-top: -30px;
}

このコードを子テーマのCSSにコピペしてください。あとはShift+F5でプレビューを更新してみると、隙間がなくなっているハズです。

マイナス30pxくらいが、ちょうどいいと個人的に思いました。ここは個人の裁量で変えてあげてください。

ちなみに-300pxくらいにすると、下のようになります。

記事コンテンツが、ヘッダーまで浸食してしまいました。面白いですね。

いや表示バグってるだけ...

SNSアイコンを表示させても、そのアイコンからコンテンツまでの隙間は指定した数値分だけ無くなっているので、問題なしです。

以上、ライオンメディアの記事上部の隙間を無くす方法でした!

ライオンメディアの上位互換『ザ・トール』のご紹介

Webに本気なら、Webに本気のテーマで。

ライオンメディアで少しずつカスタマイズしていくのもいいと思います。しかし、デザインやレイアウトの学習ばかりに時間をかけていては、いつまでたっても肝心のWebコンテンツが完成しません。そして無料版では最終的に必ず限界が来ます。

『ザ・トール』は、デザインの拡張性が抜群でカスタマイズも自由自在。クリック操作だけで簡単に自分好みのオリジナルデザインが完成します。煩わしいHTMLやCSSをいじる必要もないので初心者の方でも安心です。

令和の時代では、もうコードを書く必要はないんです。ライオンメディアを選んだアナタなら、間違いなく同じ会社が提供する『ザ・トール』を気に入ることでしょう。

一流の開発チームが作り上げた国内最高峰のWPテーマで、ぜひスムーズなWeb制作を可能にしてください。

コメントを残す

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