Image :: Convert the classic editor content to a block editor content create a non-responsive image issue

[faisalahammad]

Describe the bug When content created using the classic editor is converted to the block editor (Gutenberg), the image will not be responsive. Gutenberg wraps the image using a <p> tag, which causes the issue.

To Reproduce Steps to reproduce the behavior:

1. Create a new post using the classic editor.
2. Convert the post into Block editor.
3. Check the post image from frontend.
4. See the non-responsive image issue.

Expected behavior The image should be responsive for all devices.

Screenshots

Quick Fix: Adding the following CSS will resolve the issue.

.entry-content img {
  max-width: 100%;
}

Final Output: