Collection banner / product grid - full width

[ellacoker]

Can someone please tell me why my collection banner header and product grid is not at full width? I want to line it up to the header logo “Samiya Skin”

Thank you in advance,

Ella.

url: https://admin.shopify.com/store/wss10u-is/themes/175807824166/editor?customCss=true&previewPath=%2Fcollections%2Fmasks&section=template–24209589764390__banner&previewMode=fullscreen

[AnneLuo]

Hi, @ellacoker

You can try this code by following these steps:
Step 1: Go to the online store ->Theme ->Edit Code.
Step 2: Find the theme.liquid file and add the following code before the tag

Hopefully it will help you. If yes then Please don’t forget hit Like and Mark it as solution!

[Kyle_liu]

Hi @ellacoker

In base.css file,find ‘@media screen and (min-width: 750px)’

Modify him to the following content.

@media screen and (min-width: 750px) {
    .page-width {
        padding: 0 .5rem;
    }
}

[DaisyVo]

Hi @ellacoker ,

Can you share your store URL so that I can check?

[LizHoang]

Hi Ellacoker

• You can try to follow this step
  Step 1: Go to Edit code
  Step 2: Find file base.css and add this code at the end of the file

.page-width, .header {
    max-width: 100% !important;
}

@media screen and (min-width: 750px) {
    .page-width {
        padding: 0 !important;
    }
}

Result:

Best,
LizHoang