Page Header Image changes with Browser

I have the same issue with IE11 & Edge.

A basic header displays OK in FF52 as this browser crops the header image in the middle for the sub pages but in IE11 & Edge it crops the image at different points at the bottom of the image.

This means sites using this theme look naff across different browsers and there isn’t any standardization.

This appears to be a bug that needs to be addressed.

Thanks for the reply. How do we raise this with the developers to hopefully get a fix?

As discussed in your other thread:
You’re seeing an inconsistent display because Twenty Seventeen uses the ‘object-fit’ style on the header image. This style just isn’t supported by IE11.
https://caniuse.com/#search=object-fit

If you’re not afraid to get your hands dirty, you can install a polyfill: https://github.com/anselmh/object-fit

To be clear, this is not a bug. The theme is using cutting-edge CSS techniques and some browsers aren’t up to date yet.

If you are to use a polyfill then just be aware of the compromise. The compromise is performance.

Thank you @anevins that explains it clearly. Lets hope Microsoft Edge gets support for ‘object-fit’ soon.

To further complicate things is the differences in actual size. The Surface recommends 200%, Chrome 100%, Edge 200%, Safari “Actual Size”, Firefox 100% and IE 11 200%.

Then there are other browser settings like “don’t reduce fonts less than X points” and “font size” with 5 different settings, plus choose your own font and size and spacing.

It’s a wonder anything looks the “same.”

Thanks Andrew for your assistance here.