Make Image with Text Background Colour Full Width - Dawn 11

Store Design
, , , ,
1

Hi,

Looking to try and make the background colour of Image with Text section in Dawn 11 theme be full width of page but leave the rest of the section design as is.

Found a few “solutions” online but it stretches the full section the width of the page making text and images more spread out.

I simply want to make the background colour the full width of the page.

Thanks.

2

Hi @ed_bb
Please share store url and one screenshot where you want these changes i will definetly help you

3

Hi @codexecom

Store url is baileybespoke.co.uk

Homepage section where it talks about custom orders is where I would like to make the change.

Thanks.

4

Hi @ed_bb

This is Richard from PageFly - Shopify Page Builder App, I’d like to suggest this idea:
Online Store ->Theme ->Edit code
Assets ->Base.css

.image-with-text.image-with-text--no-overlap.page-width.isolate.collapse-corners.section-template--19618705965399__ef5b6a8f-e541-4f60-9d8c-a913a27574d2-padding.scroll-trigger.animate--slide-in {
    padding: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    margin: 0 !important;
}

Hope you find my answer helpful!
Best regards,
Richard | PageFly

5

Hi @PageFly-Richard

Thank you for your reply however unfortunately, that code stretches the entire section across the page making the image and text wider.

I just want to be able to make the background colour go full width but leaving image and text exactly as they currently are.

Are you able to assist further?

Thanks.

6

Hey @ed_bb

please try this code in base.css file at last
.shopify-section.section:has(.image-with-text) {
background: #f3f3f3 !important;
}

This is color code “#f3f3f3” you change it . you can use color code or color name both.

1 Like