How can I make custom content sections responsive in Debut theme

Solved
LukeNaowarat
Tourist
5 0 6

I just want some of my picture on website to be responsive on Mobile and table.

What should I do about it, Here is my link: https://syntechstore.com/

You can see from first picture and last picture on homepage, it isn't responsive on mobile

Please help me.

dmwwebartisan
Shopify Partner
7336 1734 2313

This is an accepted solution.

@LukeNaowarat 

Please add the following code at the bottom of your assets/theme.css OR theme.scss.liquid file.

@media only screen and (max-width:749px){
.template-index .hero--medium {height: 160px;}
.template-index .hero {background-size: contain;}
}

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 →
LukeNaowarat
Tourist
5 0 6

@dmwwebartisan 

Thanks! This is really helped me but I have facing a new problem now.
As you can see after I put the code, It is responsive but my picture is not full width and quite small,

How can I fix it, please

LukeNaowarat
Tourist
5 0 6

@dmwwebartisan 

Oh I fixed my problem already but I still have a few question to ask, I will ask it later

Thank you so much!

dmwwebartisan
Shopify Partner
7336 1734 2313

This is an accepted solution.

@LukeNaowarat 

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 →
LukeNaowarat
Tourist
5 0 6

Done sir