Remove Left and Right Padding Dawn Theme

[cetaglif]

I would like to remove the left and right padding in dawn theme,

please see reference image (wanting to remove space where red outline is

[Moeed]

Hey @cetaglif

Welcome to Shopify Community! Can you share your Store URL so I can have a look on it? Also, if you have password enabled then please share the password as well. Your cooperation would be greatly appreciated.

Best Regards,
Moeed

[cetaglif]

HEllo There

[sahilsharma9515]

Hi @cetaglif

Can you please provide your store URL and password as well if applicable, so that I can provide you solution that can work for your store.

Best regards

Sahil

[Moeed]

Hey @cetaglif

Can you share a screenshot from exactly where you’re trying to remove the padding?

[cetaglif]

Hello there;

it is hollyandivy.com.au password is knarki471

[cetaglif]

I want to remove the padding on the home page, and collection pages, so that the banners match up with the individual products

[sahilsharma9515]

Hi @cetaglif I think this is what do you need if yes then below you will find the code. if not then please provide the screenshot that will be very helpful to provide you the exact code.

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

.section-template--17911804920030__product-grid-padding.gradient.color-scheme-1 {
    padding-top: unset;
}

.collection-list-wrapper.page-width.isolate.page-width-desktop.no-mobile-link.section-template--17883793981662__collection_list_EiYC7B-padding {
    padding-top: unset;
}

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

Best Regards

Sahil

[cetaglif]

Unfortunately that does not work.

I want the areas where the red markings are on the side gone, and the collections to stretch to the side of the screen

[Moeed]

Hey @cetaglif

Follow these Steps:

1. Go to Online Store

2. Edit Code

3. Find theme.liquid file

4. Add the following code in the bottom of the file above tag

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed

[cetaglif]

That worked.

Are you able to help me do the same on these pages too?

https://hollyandivy.com.au/collections/merry-magnolia

[sahilsharma9515]

Hi @cetaglif Please add this code.

.collection-list-wrapper.page-width.isolate.page-width-desktop.no-mobile-link.section-template--17883793981662__collection_list_EiYC7B-padding {
    max-width: 100% !important;
    padding: unset !important;
}
slider-component.slider-mobile-gutter.page-width.page-width-desktop {
    padding: unset !important;
    max-width: 100% !important;
    margin: unset !important;
}

.collection.page-width {
    padding: unset !important;
}

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

Best Regards

Sahil

[sahilsharma9515]

Hi @cetaglif Here is the code for collection page:

.collection.page-width {
    max-width: 95% !important; // you can change 95 to 100% if you want the products to be in the ends.
    padding: unset !important;
}

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

Best Regards

Sahil

[cetaglif]

is this also in .liquid file ?

[sahilsharma9515]

@cetaglif yes on the same file and place where you have added the previous code.

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

Best Regards

Sahil

[Rahul_dhiman]

Hello @cetaglif
check the screenshot and do the changes accordingly.

and the result will be

and to chage the page width, check this screenshot

your all pages will become full width.

If this was helpful, hit the like button and mark the job as completed.
Thanks