Dawn theme - change section width from homepage

[americanbeautys]

I’m having trouble disabling the black background from “text with icons” section as full width.

I want the background be aligned with the same as the other objects on the page as shown - with the excess background margins removed.

https://american-beauty-supply-4139.myshopify.com/

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > styles.css and paste this at the bottom of the file:

.shopify-section.has-full-width-section {
    margin: 0 auto;
    max-width: 1440px;
    width: 90%;
    padding-left: 20px;
    padding-right: 20px;
}

[americanbeautys]

Thank you, I have used the code as advised but it has also made the homepage banner shrink its width also. The banner was full width originally. Is it possible to make the code only effective for the “text with icons” section, not to all of the sections?

[dmwwebartisan]

@americanbeautys

Please add the following CSS code to your assets/base.css bottom of the file.

#shopify-section-template--19611057422623__16317334965826230b.shopify-section.has-full-width-section {
    margin: 0 auto;
    max-width: 100% !important;
    width: 100%;
    padding-left: 0px !important;
    padding-right: 0px !important;
}

#shopify-section-template--19611057422623__16317334965826230b .section-text-with-icons .cc-carousel-container {
    max-width: 100% !important;
}

Thanks!

[americanbeautys]

Sorry that did not help

[oscprofessional]

@americanbeautys
Hello,

.border-top.section-text-with-icons {
	max-width: 1400px;
	margin: 0 auto;
}

Remove your Previous CSS and Add This CSS Go to Online Store > Theme > Edit Theme > styles.css

Like This

[ZestardTech]

Hello There,

1. In your Shopify Admin go to online store > themes > actions > edit code
2. Find Asset > styles.css and paste this at the bottom of the file:

section#section-id-template--19611057422623__16317334965826230b {
    margin: 0 auto;
    max-width: 1440px;
    width: 90%;
    padding-left: 20px;
    padding-right: 20px;
}

[Moeed]

Hey @americanbeautys

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

[americanbeautys]

n/a