Home page slider issue on desktop and mobile.

[Shinestar]

Hi,

This is my second post on my last topic (#1027) but unfortunately, the last topic is marked as closed to new replies. so I am creating the new one.

this is regarding my slider issue which is still not working on all resolutions. for more please visit this link: https://responsivedesignchecker.com/checker.php?url=https%3A%2F%2Fwww.nappets.com&width=1400&height=700

My desktop slider images are hiding the details on some resolutions. Even there are some bugs on the mobile resolutions. mobile slider left & right icons are showing on the bottom of the slider.

Please help to fix this issue.

Thank you.

This field is Private Content.

[Aizaz Awan]

Hello, @@shinestar,

Sorry for the inconvenience, but could you please provide me the screenshot of the issues one by one so that I will check them accordingly on your site and help you out?

Best Regards,
PThemes Team.

[Shinestar]

Hi Aizaz,

Thanks for your response.

Here are the screenshot of the sliders issue. the image details are hidden on some resolutions.

Thank You

Attachments:

You must be logged in to view attached files.

[Aizaz Awan]

Hello, @shinestar,

Thank you for sharing the screenshots to help me better understand the issue you are facing. Upon reviewing the screenshots, it appears that the issue is specific to mobile device resolutions.

In order to resolve this issue, I would like to suggest that you try using the following CSS code in the theme options.

Please navigate to “Skins” and select “Custom CSS”. Once there, please copy and paste the code into the bottom of the black box and click on “save settings”. After saving, please clear your browser cache and check back to your issue.

CSS Code:

@media(max-width:575px){
.feature-container .vc_slide .vc_carousel-inner .vc_item{height:auto !important;
}
}

I hope this solution will help to resolve your issue. Please let me know if you require any further assistance.

Best Regards,
PThemes Team.

[Shinestar]

Hello Aizaz,

Could you please check why the slider is not coming on full screen on my mac. There is a lot of space in the left and right side. for more please check this link https://tinyurl.com/2ztxt2gk

Thank You.

[Aizaz Awan]

Hello, @shinestar,

Again it is the responsiveness issue, your MAC screen size is very high resolution and by default bootstrap has set the classes and code till 1920px of the screen resolution, so in order to solve your issue you need the Custom CSS code, Please copy and paste the below given CSS code to Porto >> Theme Options >> Skin >> Custom CSS and check back to your site after clearing the browser cache.

@media (min-width: 1921px) and (max-width: 4000px){
.home .feature-container .vc_slide .vc_carousel-inner .vc_item .vc_inner img {
    width: 100% !important;
}
}

We hope this will resolve your issue.

Best Regards,
PThemes Team.

[Author]

Posts