.metaslider .caption not showing on mobile

  • Resolved kmrao

    (@kmrao)


    2 years, 8 months ago

    Greetings,
    I am using metalsider to display some products. I added space between image and caption by adding
    padding: 5px 20px;
    This padding is showing on computer browser. The same us not showing up on the mobile. It is coming over the image, as though the padding is not added. How to get this padding displayed on the mobile too?
    Thanks for the support.

    Regards,
    KM Rao

    The page I need help with: [log in to see the link]

Viewing 5 replies - 1 through 5 (of 5 total)

  • I went ahead and checked your site. Your slideshow seems to be displaying the caption on mobile. I could also see the padding: 5px 20px;

    Here’s a screenshot of my experience.
    https://share.getcloudapp.com/OAu6wYWk

    Thread Starter kmrao

    (@kmrao)

    Dear Arreane,
    Thank you for the effort in looking into my issue. The code works well on my computer browser. But on my mobile, the slider caption is falling over the product image. Find attached the image for your perusal: https://mrkhost.com/vetogen/debug/Screenshot.android.chrome.jpg

    Let me know if I should make changes in the CSS to enable padding even on the mobile. The padding: 5px 20px; is working only on desktop, but not on the mobile display!

    Regards,
    KM Rao

    Can you try adding the following CSS code on your site.

    .metaslider .caption-wrap {
    position: relative !important;
}

    If this doesn’t work, please let me know what device you’re using and the browser you’re using with the issue and I’ll try to replicate it.

    Thread Starter kmrao

    (@kmrao)

    I added the above code and tried. It looks good on desktop, but on the mobile, caption is overlapping the product image.
    I am using Mi A2 phone with chrome browser. Version is chrome 99.0.4844.58, operating system Android 9, Redmi y2 build/PKQ1.181203.001

    Hi,

    I checked your site’s CSS code but I couldn’t find the code below.

    .metaslider .caption-wrap {
    position: relative !important;
}

    Please make sure that you have added the CSS code on your site. Also try to purge/clear your cache if you have any optimization plugin installed.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘.metaslider .caption not showing on mobile’ is closed to new replies.