Support » Theme: Twenty Nineteen » Image width changes when you “insert link” with visual editor

  • Resolved iqvoice

    (@iqvoice)


    I don’t understand why when I chose to add a Media File link to an image using the visual editor, it causes the width of my image to no longer conform to the width specified by the theme. After adding a link, the images don’t follow the theme’s width. This is a new install of the latest wordpress with a new database to be used as a photography blog.

    When I add links to the images, the images bulge out the right side of the theme’s div. When I remove the link, they go back to normal (scaled) width. This seems wrong. Am I missing something? These are larger images in the 1200-1800px width range.

    The website above demonstrates the problem. The bluebird and moon pictures do not have a link and they conform to the proper width and the available space; the mourning dove picture has a link and it bulges out on the right side of the div.

    The issue is present on desktop browsers including Chrome, Brave, and Pale Moon. It doesn’t seem to be a problem on mobile devices.

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

Viewing 2 replies - 1 through 2 (of 2 total)
  • Hi, found what is causing this. I’ll have to file a Trac ticket for the theme regarding the issue. As of right now, you can solve this issue by adding the following into Appearance->Customize->Additional CSS

    @media only screen and (min-width: 768px) {
      .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) img {
        max-width: calc(8 * (100vw / 12) - 28px);
      }
    }
    
    @media only screen and (min-width: 1168px) {
      .entry .entry-content .wp-block-image:not(.alignwide):not(.alignfull) img {
        max-width: calc(6 * (100vw / 12) - 28px);
      }
    }

    Thank you, your solution works for me!

Viewing 2 replies - 1 through 2 (of 2 total)
  • You must be logged in to reply to this topic.