Hi all! When using images inside blog posts (not the Hero image), I struggle with the photos not doing well in mobile. Any tips or tricks to make them desktop and mobile friendly?
Example of post with photos: Is a Disney Staycation as Magical as a Disney Vacation?
Hi Jen! I reviewed your post example and noticed that you like having your image “float” on the left or right side of the post description. On smaller screens, however, the text gets compressed by the image, which can make it difficult for users to read.
A simple recommendation to improve this is to apply a max-width to your image. This will control the image width and provide more space for the text on mobile screens while keeping the layout acceptable on desktop.
Your code :
<img style="float: right; padding: 15px;">
Suggestion:
<img style="float: right; padding: 15px; max-width: 40%;>"
Feel free to adjust the percentage to a value that works well for both desktop and mobile.
Beautiful! Thanks so much!!
