画像の右側へのテキスト回り込みを解除する方法

 Googleブログ(Blogger)で画像を左揃えにした際、テキストが右側に回り込んでしまうのを防いで、下へ改行(回り込み解除)するには、HTML編集で clear: both; スタイルを追加します。

Googleブログ(Blogger)、画像の右側へのテキスト回り込みを解除する方法

  1. 記事編集画面で、上部メニューの「HTMLビュー」に切り替えます。
  2. 改行したい画像(またはその周辺のタグ)の近くにある <div class="separator"...><p> タグを探します。
  3. タグの中に style="clear: both;" を追加します。
記述例:
html
<div style="clear: both;"></div>
または画像タグのコンテナに直接:
html
<div class="separator" style="clear: both; text-align: left;">
  <!-- 画像のコード -->
</div>
 これにより、画像の左側配置を維持したまま、次の文章をしっかりと下段へ改行させることができます。詳しい使い方は Blogger 使い方ガイド も参考にしてください。

編集後記

 グーグル検索(グーグルAI)に "画像左揃え 改行する グーグルブログ"の言葉で問い合わせた結果です。あの昭和時代、『応接間に鎮守していた百科事典』を超える優れもの。ホントに一瞬ですから...。

- ここで貴方に問います -

 右配置にすべく<div class="separator" style="clear: both; text-align: right;">と記述するところを誤って、<div class="separator" style="clear: both; text-align: light;">としたら、どうなるか?