Images not displaying consistently

  • dontwastethecrumbs2

    (@dontwastethecrumbs2)


    8 months ago

    Hi, We’re having issues with our images displaying at different sizes. The images themselves are different pixel sizes and we used to be able to adjust the display size on the image block to show at 600px width. With the most recent update, that option is not available and we cannot adjust the images without resizing the photo itself outside of WP. The sizing is inconsistent all across our blog and re-doing image sizes is not ideal. Is there a way to have a default image display size? This post shows the inconsistency

    The page I need help with: [log in to see the link]

Viewing 1 replies (of 1 total)
  • Moderator bcworkz

    (@bcworkz)

    While your image blocks all appear to be set to display at 600px wide, the picture element within is set to display inline, which invalidates the block’s 600px width setting. However most of the images are 600px wide anyway, so the discrepancy is only visible in one place (the Whipped-Magnesium-Lotion-2_1200.jpg.webp image is native 1200px wide) in this particular article. Since it’s bigger than 600px and the 600px width setting is invalidated, it is displayed at the full width of its outer container, 840px.

    A possible solution is to set the picture element’s display property to block instead of inline. Then the block’s width setting should remain valid. Try adding the following CSS to the Additional CSS section of the customizer or style book:

    picture {
    display: block;
}

    This rule would be applied site-wide. Review other pages to ensure this is not causing undesirable issues elsewhere. Also be aware that caching can confuse your investigation. After adding the above code, flush any caches that may be involved, both server side and client side.

Viewing 1 replies (of 1 total)
  • The topic ‘Images not displaying consistently’ is closed to new replies.

Tags