How do I get rid of the grey space on my image banner. When I use other paramaters on my object-fit the image looks squashed onn mobile view but fine on desktop. www.peakclo.com. Dawn theme.
.banner__media.media > img {
object-fit: contain!important;
border-radius: 0%;
overflow: hidden;
}
Go to online store ---------> themes --------------> actions ------> edit code------->assets-----> section-image-banner.css
add this code at the end of the file.
@media screen and (max-width: 749px) {
.banner--small:not(.banner--mobile-bottom):not(.banner--adapt) .banner__content {
min-height: 17rem !important;
}
}
result
If this was helpful, hit the like button and accept the solution.
Thanks
It works great on mobile, how can I do the same for desktop view
