Image sizing in a blog post

Does anyone know how to size images in a blog post properly so that the image does not get cut off in mobile view?

I am specifically talking about images within a blog post and not the Post Image. 

The text seems to wrap in our blog posts in mobile view properly but images are cut off.

See example in mobile: https://community.arm.com/arm-community-blogs/b/graphics-gaming-and-vr-blog/posts/introducing-arm-accuracy-super-resolution 

Parents
  • The whole 'images in blog posts' thing could do with a rethink to be honest.

    I find it odd that you can align with text (which is just odd) or left or right of text (which again is odd unless you're really specific with the point of insertion and as for the wrapping, well that's down to pure luck. You can't add a 'caption' to the image and have that caption attach itself to the image for display purposes. If you want to caption it you have to align your text perfectly beneath it otherwise it ends up in a weird place when you view it on a different screen size/resolution/mobile device etc. And why can't you just align centre in the container so you could at least do a paragraph, centre aligned image. paragraph kind of format? 

    These questions and soooo much more..... Joy

    But seriously AnnieC back to your question. It's something we've experienced on our community too but I haven't seen it for a while. I'm not sure if that's just because we haven't added any images that go beyond the boundaries so to speak but it will be to do with the responsiveness of the image code i.e. using fixed pixel sizes for images rather than percentage size. For example an image set to 'width 100% will take up 100% of the available container width  but a fixed size of x1000 pixels will cause an image to overspill the available container size if the physical screen size is only 500 pixels. 

    Have a chat with your dev team and ask them to take a look at the responsive code Slight smile

    Hope that helps! 

    Lisa

Reply Children
No Data