テスト投稿19個目です。画像を左回りで掲載してから文章を入れます。縦長の画像にしたので画像の横から文章が表示されると思います。

以前投稿した「9つ目のテスト投稿」と同じ内容です。
画像が入っている「a」タグの終了タグ「/a」の後ろで「改行」をしてから文章を書き始めました。



ちゃんと画像の横に文章が入っています。
しかも上から！！
そういう設定がCSS上でされているんでしょうね。



こうやって見たらわかるんですが、画像のすぐ横に文章が表示されてしまって見づらいです。できれば画像の横に余白がほしいです。


.article__content img {
max-width: 100%;
height: auto;
margin-bottom: 10px;
}


これが多分、画像の設定部分のCSSの記述です。
ここに「margin-right:10px」を入れてもいいんですが、そうすると、例えば横長の画像の場合も右に余白が入ってしまうので、中央寄せの意味がなくなります。
このCSSに直接記述するのはやめて、記事を書いているこの画面上で、「a」タグの中に「style="margin-right:10px;"」を入れてあげればいいと思います。



文字が画像の右側に表示されているわけですが、これを解除するためには「<br clear="all">」を入れると、画像の下に文章が移動します。
このページを見たらわかると思います。
画像横の「できれば画像の横に余白がほしいです。」という文言のすぐ横に「<br clear="all">」を入れているので、CSSの記述部分は画像の下に表示されていますからね。


とか書いたんですが、説明がわかりにくいですね。
なんかすみません(´･ω･｀)