Hello! I am having an issue with the Safari browser. It is stretching my image outside of the my container. It’s only happening within Safari. I can fix the issue by setting a max width or height but then the whole design of this section falls apart and looks bad.
In your read-only, I noticed that .service-feature_image-wrapper is set to display: flex, but it doesn’t have to be.
If I were coding this, I’d set .service-feature_image-wrapper to display: block (default), keep your 4rem padding, and then set the .services_image to width: 100%, height 100%, fit: contain (as opposed to cover).
That way you avoid any unwanted flex behaviour whilst ensuring the image displays in full.
Hope this helps! (Again… I couldn’t replicate the issue, so maybe this is a solution in want of a problem!)
Hello @ColinSimmons I did fix the problem but I will also keep that fix in mind. I am still wrapping my head around how certain displays can function. I might ever revise my fix if this works better than my workaround.