I have a Bootstrap 4 slider in progress at https://filathlos.imagewize.com/ . When I add images of a 0.75 ratio like 2000x1500 they display and resize well. 3000x2000 works too. This with them being loaded with:

the_post_thumbnail('post-thumbnail', ['class' => 'img-responsive responsive--full', 'title' => 'Feature image']);

It seems to show the images the way I cropped them in WordPress or not and then load them with file dimensions that vary from image to image.

When I use add_image_size( 'b4-slider', 2000, 1500); or add_image_size( 'b4-slider', 2000, 1500, true); because I am like, let's automate setting the proper size for these babies.. they are no longer responsive. They get squashed when I shrink the browser window size.

How is this possible?

  • Do see in CSS now that image attributes are being ignored: img[Attributes Style] { width: 3001px; height: 2000px;} This by my own set width 100% and height auto for the slider image. And the full sized images loaded do have the ratio I gave them. Some the same as the add_image height I added. So why does that not work..
    – rhand
    Mar 14, 2017 at 8:23

1 Answer 1


Hmm, I figured it out. I changed the thumbnail AND removed the needed class img-responsive to apply responsive dimensions. Once I kept those all was fine. –

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.