Full width banner on mobile

Solved
ThomasKramer
New Member
2 0 2

Hi all,

We are trying to make the banner element on our homepage full screen width for mobilee only. 

We are using the Expression theme. 

Can someone help?

link: springblossom.de 

Accepted Solution (1)

Accepted Solutions
dmwwebartisan
Shopify Partner
9824 2236 3076

This is an accepted solution.

@ThomasKramer 

Please Go to Online Store->Theme->Edit code then go to assets/styles.css ->paste below code at the bottom of the file.

@media screen and (max-width:767px){
#shopify-section-banner .container {
    padding-left: 0;
    padding-right: 0;
}
#shopify-section-banner .container slick-track,#shopify-section-banner .container slide{
width:100% !important
}
}

Thanks!

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →

View solution in original post

Replies 4 (4)
dmwwebartisan
Shopify Partner
9824 2236 3076

@ThomasKramer 

Please Go to Online Store->Theme->Edit code then go to assets/styles.css ->paste below code at the bottom of the file.

@media only screen and (max-width: 560px){
.main-page-content {
    padding-right: 0px !important;
    padding-left: 0px !important;
    overflow: hidden;
}
}

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →
ThomasKramer
New Member
2 0 2

@dmwwebartisan Thanks for your prompt help. I added the code, but this did not change anything...

 

oscprofessional
Shopify Partner
9202 1563 1928

hello @ThomasKramer 

You can try this code
Just go to online store -> action ->theme->edit code-> asset->style.css

paste the code in this file

@media screen and (max-width:767px){
#shopify-section-banner .container {
    padding-left: 0;
    padding-right: 0;
}
#shopify-section-banner .container slick-track,#shopify-section-banner .container slide{
width:100% !important
}
}
If helpful then please Like and Accept Solution. Want to Speed up your Shopify Website Guranteed result Whats app
| Hire us
| Expert Site Speed Optimization | Performance Site Audit | Shopify Private App | Custom Theme Development & Modifications any Shopify Theme | Shopify SEO | Digital Marketing
For Quick Chat | Email: pallavi@oscprofessionals.com | Skype : oscprofessionals-87
dmwwebartisan
Shopify Partner
9824 2236 3076

This is an accepted solution.

@ThomasKramer 

Please Go to Online Store->Theme->Edit code then go to assets/styles.css ->paste below code at the bottom of the file.

@media screen and (max-width:767px){
#shopify-section-banner .container {
    padding-left: 0;
    padding-right: 0;
}
#shopify-section-banner .container slick-track,#shopify-section-banner .container slide{
width:100% !important
}
}

Thanks!

 

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com | Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | Bag is a cart drawer that maximizes your sales. View app →

View solution in original post