What's your biggest current challenge? Have your say in Community Polls along the right column.

Re: Full Width Text Required on Image Banner (Dawn Theme)

Solved

Full Width Text Required on Image Banner (Dawn Theme)

alfiescoffeeco
Tourist
4 0 1

I have 3 x Image Banners with text on my site and I would like the text to be the full width of the screen, not condensed into the centre as it is now. I have tried multiple solutions found on the Shopify forum but none have solved my problem.
Screenshot 2024-10-10 at 14.10.28.pngAbove is one of the Image Banners that are on my website. Is there a solution available where the negative space to the left and right of this text box is filled?

Many thanks.

Accepted Solutions (2)
Tech_Coding
Shopify Partner
417 110 98

This is an accepted solution.

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media only screen and (min-width: 750px) {
    .banner--content-align-left.banner--desktop-transparent .banner__box{
        max-width: 100% !important;
     }
}
</style>

Tech_Coding_0-1728567230807.png

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.

View solution in original post

Tech_Coding
Shopify Partner
417 110 98

This is an accepted solution.

You're very welcome! I'm delighted that the solution was helpful. Feel free to reach out if you need any further assistance in the future. If you found this information valuable, I'd be grateful if you could give it a thumbs-up.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.

View solution in original post

Replies 6 (6)

Tech_Coding
Shopify Partner
417 110 98

Hello @alfiescoffeeco 

would you like to share your store URL and password if any please.
so i can check and provide you possible solution for your question.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.
alfiescoffeeco
Tourist
4 0 1
Tech_Coding
Shopify Partner
417 110 98

This is an accepted solution.

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
@media only screen and (min-width: 750px) {
    .banner--content-align-left.banner--desktop-transparent .banner__box{
        max-width: 100% !important;
     }
}
</style>

Tech_Coding_0-1728567230807.png

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.
alfiescoffeeco
Tourist
4 0 1

Works perfectly - thank you for your help!

Tech_Coding
Shopify Partner
417 110 98

This is an accepted solution.

You're very welcome! I'm delighted that the solution was helpful. Feel free to reach out if you need any further assistance in the future. If you found this information valuable, I'd be grateful if you could give it a thumbs-up.

my reply helpful? Click Like to let me know!
your question answered? Mark it as an Accepted Solution.
Shopify UI Developer
Your Coffee Tips adds a little sweetness to my day.
alfiescoffeeco
Tourist
4 0 1

Hello, following on I have another query regarding customising the product pages of my shop. Is it best to create another thread for this, or continue here?