WordPress Habakiriでページ内に区切り線を引く

　Habakiriに限った話ではないと思いますが区切りブロックやカスタムHTMLで<hr>を入力しても横線が表示してくれません。いろいろググッてみるとどうやらhrでなくborderを使う方がいいようです。ただ、以下の書き方はちょっとベタな書き方かもしれません。

まず端から端までの横線を描くためにstyle.cssに以下のコードを追記します。管理画面から[外観]->[テーマエディター]で編集してもOKです。

p.sepbar {
   border-bottom: 1px solid red;
}

で、ページ編集に戻り横線を引きたいところにカスタムHTMLブロックを追加して以下を記入します。

<p class="sepbar">  </p>

とすると、こうなります。

でも、ちょっと余白がほしいですよね。で左右に80pxの余白を付けたいと思います。

また、style.cssに以下を追記します。

.rl_margin {
	margin-left:80px;
	margin-right:80px;
}

ページ編集に戻って余白のある横線がほしいところにカスタムHTMLで以下を書きます。

<div class="rl_margin"><p class="sepbar">  </p></div>

でプレビューで見てみると以下のようになります。

また、もう少し綺麗な方法がわかったら編集していきます。

HobNote