I want to make this part of the screen smaller in height for mobile. Is there a way I can customise the height rem or even change the slide size from ‘medium’ to ‘small’ for mobile only.
This is the main section I want to decrease the height of:
As well if someone could tell me how to do on the photo too, that would help. Thank you!
Hi @lukafernada ,
I have reviewed your requirement, you just need to edit css script and the issue will be resolved. You can follow my instructions!
Step 1: Go to Admin → Online store → Theme > Edit code:
Step 2: Search for the file base.css or section-image-banner.css. And add this code snippet to the end of the file.
@media only screen and (max-width: 768px) {
.slideshow__slide .banner__box {
padding: 0rem 3.5rem !important;
}
}
Step 3: Save and reload home page.
=>> The result:
I hope these instructions will help you. If they are helpful, please give us likes and mark as the solution.
Have a nice day sir!
Hi @lukafernada
Check this one, if its enough. Thanks!
From you Admin page, go to Online Store > Themes
Select the theme you want to edit
Under the Asset folder, open the main.css(base.css, style.css or theme.css)
Then place the code below at the very bottom of the file.
@media only screen and (max-width: 749px){
.slideshow__slide .banner__box {
padding: 0 3.5rem !important;
}
}
And Save.
result:
Please don’t forget to Like and Mark Solution to the post that helped you. Thanks!
