Front page header slider takes too little space on tablet and mobile view

My web page looks great on a PC, but not on a tablet and mobile phone. As i mentioned above too little space is used in the mobile and tablet views, which result in a white space under my website.

Any idea how i can fix this?

Hello there,

Have you tried to enable full screen slider?

Regards,
Kharis

Hi there Kharis

Yes i have, the problem is then the page seems quite “zoomed in” to the pictures. Perhaps resizing them to a different ratio might work.

Or is there a way to make the slider taller?

Hello there,

While full screen slider is enabled, add this CSS code into Appearance > Customize > Additional CSS.


.header-slider,
.sydney-hero-area,
.slides-container .slide-item {
  height: 100vh !important;
}

Regards,
Kharis

Thankyou for the help

You’re welcome and best wishes!

Regards,
Kharis