WordPress特有のbr要素自動追加

投稿本文にフレージング要素　例えば<span>要素等を記述した場合、テキストエディタでの改行を行うと、br要素が追加されて表示されます。

手書きで作成したhtml等の場合は、改行をbrに変換したり、連続改行を目印にp要素でラップするといった事は行われないために同じソースでも異なった表示になってしまいます。

このような事から、br要素やp要素の自動追加が気に入らないという声を時々目にします。

テキストエディタで、以下のようなソースを記述すると

<p>
<span>あ</span>
<span>い</span>
<span>う</span>
<span>え</span>
<span>お</span>
</p>

ブログでは、通常以下のように表示されます。

あ
い
う
え
お

以下のように記述すると、改行は入らずに

<p><span>あ</span><span>い</span><span>う</span><span>え</span><span>お</span></p>

このように、横並びで表示されますが

あいうえお

少し複雑なhtmlの場合、テキストエディタのソースは非常にみずらくなります。

このような事から、あるユーザーにとっては、改行するだけでbr要素を追加してくれる「超便利機能」が　あだとなる事があります。

高度なカスタマイズ技術がない場合でも、CSSで見た目を調整してあげることが出来ます。

例えば　br　が追加されていても、表示に影響を与えないようにCSSで調整するなら style.cssにクラスを一つ書きます

.no-br br{
 display:none;
}

投稿本文には、以下のように記述します。

<p class="no-br">
<span>あ</span>
<span>い</span>
<span>う</span>
<span>え</span>
<span>お</span>
</p>

すると、以下のように表示されます。

あ
い
う
え
お

厳密にいうと、span要素を繋げた場合に比べると、文字間隔が広がってみえると思いますが、ブラウザが　改行分の空きを作成するためなので、必要な場合は
内容物に合わせて、

.no-br span{
 margin-left:-4px;
}

等とinline-block要素での、要素間の空きを調整するのと同じ要領でスタイルを追加するといいと思います。

CSS note