How to shrink main slider size by 50% and center it for desktop users?

[Johnathon Nguyen]

The main slider is too big for desktops and the pictures turn out blurry. I would like to shrink it by about 50% and have it centered for desktop users. Mobile users are fine.

[themearile]

Hi Johnathon Nguyen

Thanks for contacting us.

Please share your site URL so we can take a look and give you a good solution.

Thanks

[Johnathon Nguyen]

http://www.txcitydetailing.com

[themearile]

Hi Johnathon

Please add the below CSS code to decrease the height of the slider image in the Additional CSS box.

For this Go to Appearance >> Customize >> Additional css Box

#theme-main-slider .item {
background-repeat: no-repeat;
height: auto !important;
}
#theme-main-slider .item {
padding-top: 40.50%;
display: block;
height: 0;
}

And please use the slider image size is 1920*600px.

You can set an image padding value as per your need.

Let me know if it works for you.

Thanks
ThemeArile

[Author]

Posts