On my WordPress blog, I use Jetpack’s Site Accelerator to make my images load faster. The Site Accelerator works extremely well and to do so it adds the scrset and sizes HTML attributes to all of my images.

The problem is that some of my images, especially verticle ones, are huge on desktop screens and are not fully viewable without scrolling.

I would like to set a max-height of 95vh on all of my post images but I can’t override the settings in the sizes attribute.

When I use this CSS it distorts the image:

img {
  max-height: 95vh;
  width: auto;
  margin:auto;
}

I do not want to disable Site Accelerator, I want to use it and set a max height, can anyone please help me with this?

A sample of the image HTML in question:

<img 
     data-attachment-id="12148" 
     data-permalink="https://matthewtrader.com/honoring-mlk-while-social-distancing-at-the-lorraine-motel/lorraine-motel-memphis-tennessee-4" data-orig-file="https://matthewtrader.com/wp-content/uploads/2020/06/Lorraine-Motel-Memphis-Tennessee-4.jpg" 
     data-orig-size="938,1250" 
     data-comments-opened="1" 
     data-image-meta="{&quot;aperture&quot;:&quot;1.8&quot;,&quot;credit&quot;:&quot;&quot;,&quot;camera&quot;:&quot;iPhone 11 Pro&quot;,&quot;caption&quot;:&quot;&quot;,&quot;created_timestamp&quot;:&quot;1589051725&quot;,&quot;copyright&quot;:&quot;&quot;,&quot;focal_length&quot;:&quot;4.25&quot;,&quot;iso&quot;:&quot;32&quot;,&quot;shutter_speed&quot;:&quot;0.000147058823529&quot;,&quot;title&quot;:&quot;&quot;,&quot;orientation&quot;:&quot;0&quot;}" 
     data-image-title="Lorraine Motel, Memphis, Tennessee" 
     data-image-description="<p>Lorraine Motel, Memphis, Tennessee</p>" 
     data-medium-file="https://matthewtrader.com/wp-content/uploads/2020/06/Lorraine-Motel-Memphis-Tennessee-4-750x1000.jpg" 
     data-large-file="https://matthewtrader.com/wp-content/uploads/2020/06/Lorraine-Motel-Memphis-Tennessee-4.jpg" 
     width="938" height="1250" 
     src="https://matthewtrader.com/wp-content/uploads/2020/06/Lorraine-Motel-Memphis-Tennessee-4.jpg" alt="Lorraine Motel, Memphis, Tennessee" 
     class="wp-image-12148" 
     srcset="https://matthewtrader.com/wp-content/uploads/2020/06/Lorraine-Motel-Memphis-Tennessee-4.jpg 938w, 
             https://matthewtrader.com/wp-content/uploads/2020/06/Lorraine-Motel-Memphis-Tennessee-4-750x1000.jpg 750w,
             https://matthewtrader.com/wp-content/uploads/2020/06/Lorraine-Motel-Memphis-Tennessee-4-768x1023.jpg 768w" 
     sizes="(max-width: 938px) 100vw, 938px"
>