Remove large white space under my slideshow on mobile view, dawn theme

[Verterra]

Hello,

I am looking for help with the slideshow on my website. When in mobile view, there is a big amount of white space below the photos which I am hoping to remove. Is anyone able to advise on how I can remove the white space? 

My website is www.verterra.com.sg

Thanks!

[Verterra]

Hello,

I am using dawn theme on shopify

[Arif_Shopidevs]

Hello, The problem occured due to this CSS

@media screen and (max-width: 749px) {
    .banner--medium:not(.banner--mobile-bottom):not(.banner--adapt) .banner__content {
         min-height: 34rem;
    }
}

min-height: 216px !important; 

You can adjust the min-height , it will fix your issue

[Verterra]

Thank you! Can I check where I can locate this code so I Can edit it please?

[Arif_Shopidevs]

@Verterra 
Go to your theme ->find the CSS assets/section-image-banner.css inside the CSS search the line and then you can adjust .

Online Store ->active theme->edit code

[Verterra]

Hello,
I adjusted it to 216px as you advised, but now it totally removes the slideshow banner, and I can only see the pagination circles at the top of the page.

[Arif_Shopidevs · Accepted solution]

Please use this css it will solve the issue

@media screen and (max-width: 749px) {
  .banner--medium:not(.banner--mobile-bottom):not(.banner--adapt) .banner__content {
    display: none;
  }
  .banner__media {
    position: unset !important;
}
}

[Verterra]

Thank you so much! this Really worked like a charm!

[Arif_Shopidevs]

Glad to know it works. Do not forget to like our solution 🙂

[ShishirHelps]

Hi @Verterra 

Did you want it like this? pls let me know. If yes add me as a colloborotor I will fix it for free 😊

[Verterra]

Hi ShirShir, 

Yes that is exactly what I need! I'm sorry I dont know how to add someone as collaborator. Are you able to share with me how you made the edits and I can customise in the CSS accordingly? Thank you so much