Rows Not Displaying Properly on Mobile

  • Hi,

    We are using the Olins Creative theme, and have noticed some issues with Mobile Display. Specifically, our Pricing Boxes, which look beautiful on the desktop site, overlap and look really sloppy on the mobile version. How can we prevent this from happening?

    Ideally, the Pricing Boxes would appear in horizontal rows on the website and would stack vertically on the mobile version.

    Thank you for your help!

    Best,

    The ANYA Team

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

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

  • Hello.

    It will be easier if you take some other plug-in for this.
    There is a great choice available: https://premium.wpmudev.org/blog/pricing-tables/
    I’m using this one: https://supsystic.com/price-tables-examples/

    You should probably reach out to the theme developer directly, but using CSS you can get those columns to stack in mobile. For some reason though I’m seeing a class of .vc_non_responsive in the CSS, so it might be that you just need to adjust the settings to make those react responsively:

    https://apollo13themes.com/advanced-tricks-visual-composer/

    However, if that doesn’t work you can try adding this to your custom CSS:

    @media screen and (max-width: 767px) {
    .vc_non_responsive .vc_row .vc_col-sm-4 {
    position: relative;
    float: none;
    width: 100%;
    padding:0;
    }
    }

    Thread Starter teamanya

    (@teamanya)

    Thank you both so much! This worked perfectly.

    By any chance, do you also know how to customize the buttons on the Pricing Boxes? They automatically say “Details,” but we would like to change to “Purchase.” There does not appear to be a customization option in the Pricing Table editor…

    Best,

    The ANYA Team

    That I don’t know. I’d recommend reaching out to the theme developer about it.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Rows Not Displaying Properly on Mobile’ is closed to new replies.