Help me adjust the image banner width to match the sections below it. on desktop version now the image banner [email removed] top is showing full width while the sections below it have less width. here’s the store URL
You can used this
Steps to Add Custom CSS in Shopify1. From your Shopify admin, go to Online Store > Themes.
- Click Actions for the theme you want to edit, then select Edit code.
- Find the base.css file under Assets (or whichever CSS file your theme uses).
- Scroll to the bottom of the file and add the following CSS code:
.banner--adapt {
width: 1400px;
margin: auto;
}
Hi Ashar,
Thanks for the reply.
added the code [email removed] end of the base.css
still not updated. while viewing on full screen still the banner width is over sized.
Let me know the screen size please.
Also just make sure do hard refresh please
So i adjusted the width to 1200px and it worked. thank you so much for the help.
but after applying it the previous code we did for the mobile version no longer working. its now showing the banner at full 1200px width. can you please help with that?
store link: https://s11iaukvyuisywf1-90656506170.shopifypreview.com
scroll option showing on bottom to view the full banner. see below.
@media (min-width: 768px) {
.banner–adapt {
width: 1200px;
margin: auto;
}
}
So now the issue cleared. I’ve tried to edit the code and it seems working. below is the code,
/* Apply only on mobile screens */
@media (max-width: 768px) {
.banner__media img {
zoom: 2;
object-fit: cover;
object-position: right;
height: 183px !important;
width: 100% !important;
position: relative !important;
}
.banner__media:before {
padding-bottom: 0 !important;
}
}
@media (min-width: 768px)
{
.banner–adapt {
min-width: 300px;
max-width: 1300px;
margin: auto;
}
Thanks
can you help with another question?
Re: how to change the button color for whole website.
https://community.shopify.com/c/shopify-design/how-to-change-the-button-color-for-whole-website/m-p/2882473#M755769