Change size on hextom free shipping bar on cart page - Dawn Theme

Solved

Change size on hextom free shipping bar on cart page - Dawn Theme

Dekanten
Navigator
325 1 117

Hi

 

I want to make this section wide as the others, now i have tried several things without better result. Do you guys have an idea to fix this small bug? 😀

 

Thanks in advance. 😀

 

www.dekanten.no/cart

 

See attached image:

 

Skjermbilde 2024-09-17 kl. 00.29.01.png

Accepted Solution (1)

dws_pvt_ltd
Shopify Partner
329 65 91

This is an accepted solution.

Hello @Dekanten, Please follow these steps to add this CSS code:
1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open base.css" OR "theme.css" OR "cart.css".
6. Add the following code at the end of the file.

@media only screen and (max-width: 770px) {
    #fsb_background {
        width: 345px !important;
        margin: 0 auto !important;
    }
}
@media only screen and (max-width: 349px) {
    #fsb_background {
        width: 290px !important;
        margin: 0 auto !important;
    }
    #fsb_background > * {
        font-size: 10px !important;
    }
}

 

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

Helpful? then please Like and Accept the Solution.
For any inquiries, please feel free to contact via WhatsApp and Email: sales@dolphinwebsolution.com.
For more information visit our website Dolphin Web Solution Pvt Ltd.

View solution in original post

Replies 2 (2)

dws_pvt_ltd
Shopify Partner
329 65 91

This is an accepted solution.

Hello @Dekanten, Please follow these steps to add this CSS code:
1. Go to your Online Store
2. Click on "Themes"
3. Select "Edit code"
4. Open your CSS file. If you have a custom CSS file, open that instead.
5. If you can't find your custom CSS file, open base.css" OR "theme.css" OR "cart.css".
6. Add the following code at the end of the file.

@media only screen and (max-width: 770px) {
    #fsb_background {
        width: 345px !important;
        margin: 0 auto !important;
    }
}
@media only screen and (max-width: 349px) {
    #fsb_background {
        width: 290px !important;
        margin: 0 auto !important;
    }
    #fsb_background > * {
        font-size: 10px !important;
    }
}

 

Feel free to reach out if you have any questions or need assistance.
Best Regards,
DWS.

Helpful? then please Like and Accept the Solution.
For any inquiries, please feel free to contact via WhatsApp and Email: sales@dolphinwebsolution.com.
For more information visit our website Dolphin Web Solution Pvt Ltd.
Dekanten
Navigator
325 1 117

Hi and big thank you so this works like a charm so im really glad for the result, thank you so much for your help and support. 😀