Bloggerで記事中の画像がサイドバーにはみ出るのを修正・解消する方法

Bloggerでブログを開設して、さあ大きい画像を貼った記事を書くぞ！　ってなった時に、画像を元のサイズで挿入すると、サイドバーに大きくはみ出てしまうことがありませんか？

上の画像のような状態です。

これを修正するCSSを作成しました。

素人が試行錯誤しながら書いたCSSですので、美しくない・正しくないかもしれません。

使う場合はあくまで自己責任でお使いください。

.post-body .separator a {
 margin: 0 !important;
}
.post-body .separator a img {
 max-width: 100%;
 margin: 0;
 padding: 0;
 border: none;
 box-sizing: border-box;
 box-shadow: none;
}

このCSSを追加すると以下の画像の通りになります。

これで修正・解消できると思います。

【Amazon.co.jp 限定】 1冊ですべて身につくHTML & CSSとWebデザイン入門講座 (DL特典: CSS Flexbox チートシート)

Amazonで調べる