Images sized correctly in editor are too small on live?

  • I have a pretty simple layout on a page that stacks text and images in columns. All the images are sized correctly on the page in the editor, but when I preview or publish the page to live, some images show roughly a quarter of the size they should be. Not all images do this though. I’m using WordPress 6.5.2.

    I have tried:

    1. Sizing them using drag bars but also inputting the size directly.
    2. Replacing the affected images with different ones (and replacing correctly sized ones too).
    3. Making sure the images are the same size, scale, type etc. in the Media Library as other images that do size correctly.
    4. Changing the theme.
    5. Deleting the page and re-creating it again in different ways (eg using groups with rows rather than stacks).

    But no matter what, some images simply appear smaller on the live site than they do in the editor:

    • This topic was modified 6 months, 3 weeks ago by gilgongo.
Viewing 4 replies - 1 through 4 (of 4 total)

  • The images may be changed by the theme or plugin you are using. You could try changing the theme as a test or deactivating plugins that could be responsible for this.

    You are also welcome to post a link to the affected page, then you might be able to see what is going on in the frontend.

    Thread Starter gilgongo

    (@gilgongo)

    Thanks – I tried changing the theme but it made no difference: the same images were affected (I have also tried viewing in Chrome vs FF vs Edge – all show the same thing).

    I am running no plugins (this is just a test site).

    https://oddjob.bakerbates.com/

    Looking at the front end, it appears that the dimensions I’m setting in the editor on some of the images further down the page just aren’t being respected when the page is rendered.

    It’s not essential that I do this in WP. I’m not that experienced with it, and don’t intend to modify the content. I may just try laying out the page in simple HTML/CSS by hand unless you can suggest and easy fix. This feels like some bug to me.

    • This reply was modified 6 months, 3 weeks ago by gilgongo.
    • This reply was modified 6 months, 3 weeks ago by gilgongo.

    The style is the reason. The images are provided with a max-width of 100% for which there is no reference point. You can solve this like this:

    .wp-block-image img {
 max-width: none;
}
    Thread Starter gilgongo

    (@gilgongo)

    Oh OK (not that I know how to hack the CSS in WP but I guess I can work it out).

    Out of interest, why is that happening in the first place though? Is it something I did, or is WP just like this?

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Images sized correctly in editor are too small on live?’ is closed to new replies.