スマホで見た場合の改行がおかしい

ちょっと僕が意味を取り間違えてるかも知れませんけれども…、本来改行を反映させたい場合はbrタグを入れないといけません。

wordpressは、
1行目⇒　文章文章文章文章文章文章
2行目⇒
3行目⇒　文章文章文章文章文章文章

このように書くと、文章文章文章文章文章文章をpタグで囲むと思います。なので改行したように思うわけです。

例えば、

ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ

と入れたとします。文章は画面端で折り返されてはいますが1行です。そしてpタグで囲まれているため段落になっています。
これを任意の位置で改行したい場合は、

ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ(ここにbrタグ)ああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああああ

と入れると、brタグの所で改行します。もちろんpタグで囲まれているので段落の中での改行になります。
例えば上記でbrタグの後でenterによる改行を入れたとしても段落の中でしかもbrが入っているのでそのbrの後ろの改行は無視されるのではないかと思います(2重に改行されるわけではない)。
編集画面の表示的には\nが入っている感じ。これは改行コードと言うやつなのですが、ソース画面(web開発環境とか)では\nが入っている部分は改行しているはずですがhtmlでの改行はあくまでbrなので\nは無視されると思います。おそらく（笑）

さてここで色々と問題が出る時があります。例えばPCの場合、画面幅が十分にある時は#mainのサイズは740pxです。paddingやらが設定してあるので、実質680pxぐらいしか利用できないのですが、これは例えば16pxのフォントサイズの場合、横42文字分ぐらいです。

もし、42文字表示できる領域の43文字目にbrタグがあった場合、1文字だけの所で改行したりすることになり見栄えがとても悪いですよね？
なのでテキストエディターでは、enterを入れることによる改行のポイントまでをpタグで囲って1行にしているわけです。すると、1行で表示されるわけですから画面幅横がどれだけであろうと、文章が途中で途切れず(改行されず)きちんと続けて1行で表示されるということになります。

こういうことから、自分の意図がはっきりしている場合を除いてbrタグはあまり使わないほうが良いと言うのがレスポンシブなデザインでは慣例となっています。

ビジュアルエディターもその場で見えないだけでpタグで囲っているのですが、本番で表示されるのと同じように編集できますから気が付かないだけなのかも知れません。編集画面で文字数の上にpと表示されていると思います。
テキストエディターも特別pタグで囲まなくても勝手にpタグで囲っているので、文字のはじめからenterで改行した所までが段落と思って間違いないかと思います。

段落と改行を再考して、できたらweb開発環境(モダンブラウザでF12キー)より記事のソースを見ることをオススメします。すると仕組みがだんだん理解できるのではなかろうかと思います。

と、半分想像も踏まえて書いてみました。

ソースのはりつけがおかしかったようで申し訳ありません。
ソース部分は下記です。
貼り付け方がわからないので、「＜」、「＞」を全角にしました。

＜p＞1行目⇒ 文章文章文章文章文章文章＜br /＞
2行目⇒ 文章文章文章文章文章文章＜/p＞

>「brタグはレスポンシブデザインの場合は無効になるよ」ということでしょうか？

いえいえ、画面幅がまちまちなものに対応するのがレスポンシブデザインなので、変な所で改行されると見栄えが悪い(デザインが崩れる事がある)と言うことからbrタグは自分が意図とする所以外は使わないほうが良いということです。

もし、
＜p＞1行目⇒ 文章文章文章文章文章文章＜br /＞
2行目⇒ 文章文章文章文章文章文章＜/p＞
このように書かれているのであれば、

1行目⇒　文章文章文章文章文章文章
2行目⇒3行目⇒　文章文章文章文章文章文章

こうなっているはずですが、仮にbrが無い場合、つまりはbrの位置でenterによる改行をした場合は、

<p>文章文章文章文章文章文章</p>
<p>文章文章文章文章文章文章</p>

こうなると思います。
と、毎回<をコード化するのは面倒なので うちの海外サーバーテスト投稿
にテキストで編集した内容をcrayonで表示したものと、その結果部分を編集投稿してみました。で原因がわかりました。

@media screen and (max-width: 639px)
.article br {
  display: none;
}

narrow.cssのこやつが悪さをして効いていたようです。まぁわいひらさんの何かしらの意図があるんでしょうけれども、不要ならコメントアウトしてしまえば良いと思います（笑）
639px以外にももしかしたらあるかもしれないので、#the-content br { display: block; }とでも子テーマに入れたりですかね。

ちなみに、モモタロスさんがレスされたコードの部分は間違っていません。管理者権限のない人がスクリプトっぽいものを投稿してcodeタグを入れるとエンティティ化されてコード(htmlコード)で表示されるのです。これはその内、わいひらさんが修正してくれると思います。

Hidekichiさん

ありがとうございます！
教えて頂いた箇所をコメントアウトしたら大丈夫でした！
ホントに助かりました。

質問者の方と内容は同じだけどまったく逆の希望なのですが、

これまでPC画面で文章が見やすいようにと

<p>1行目⇒ 文章文章文章文章文章文章<br />
2行目⇒ 文章文章文章文章文章文章</p>

とブログを書いてきたのですが、

WordPressへ移行するにあたり、
・PC表示は<br />を反映したままで
・スマホ表示は<br />が反映されず、改行なしのひとつづきの文章に
という動きをして欲しいのです。

上記のやり取りを拝見するとCSSをどこもいじらなくてもそうなるのかと思ったのですが、ダメだったので自分で

@media screen and (max-width: 480px) {
br { display : none ; }
}

を加えてみましたが反映されず、よく分からなくて困っています。
お助けいただけますと幸いです。

自分で解決できました。
http://wp-simplicity.com/simplicity1-7-6/
に記述があることに気が付きました。
失礼いたしました。