My banner image has a ton of space around it. How can I fix it?

Store Design
1

I used Canva to resize the image, but if I make it bigger then it makes my banner size bigger, which I don’t want. I want the image to take up some of the blank space up around it without making the banner size bigger. There is plenty of room to make the image bigger and use up some of that space. It looks good on mobile (because I got help here). :slightly_smiling_face:

Thanks

website is: https://weekendcowgirlboutique.com/#

2

Add this code in your base.css file:

@media (min-width: 500px) {
  div#Banner-template--16160181223636__image_banner img {
    width: 149%;
    height: 149%;
    transform: translate(0px, -15%);
  }
}
@media (max-width: 499px) {
  div#Banner-template--16160181223636__image_banner img {
    width: 120%;
    height: 120%;
    transform: translate(0px, -7%);
  }
}

The second code is for mobile, I have made the design a little larger on these devices.

Before:

before.PNG
before.PNG1027×517 81.9 KB

After:
after.PNG
after.PNG1021×523 148 KB

3

Much better, thanks so much!