Columns not working on mobile

  • Resolved diaweb

    (@diaweb)


    1 year, 10 months ago

    Hi there,

    I installed the Team plugin to display several members of a childcare service. On a computer screen the members are displayed in 4 columns and it works very well. But on mobile devices the number of columns remains fixed at 3 even if I configured the number to 2 for tablets and 1 for phones in the plugin settings. I really need to be able to change the number of columns. How can I do it?

    Thanks for your help.

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

Viewing 2 replies - 1 through 2 (of 2 total)
  • Plugin Support SM Rafiz

    (@srafiz)

    Hi @diaweb

    The responsive columns are not working because the CSS has been overridden in the theme (Screenshot: https://prnt.sc/Pu_NzB18xX6E). You can check by switching to the default ‘Twenty Twenty One’ theme.

    Please enter the below CSS codes in Dashboard->Appearance->Customize->Additional CSS:

    .rt-team-container .rt-col-md-3 {
    width: 100% !important;
}

@media only screen and (min-width: 768px) {
    .rt-team-container .rt-col-sm-6 {
        width: 46% !important;
    }
}

@media only screen and (min-width: 992px) {
    .rt-team-container .rt-col-md-3 {
        width: 23% !important;
    }
}

@media only screen and (max-width: 767px) {
    .rt-team-container .rt-col-md-3 {
        margin-left: 0 !important;
        margin-right: 0 !important;
        height: auto !important;
    }
}

    Hopefully, your issues will be resolved. Thank you.

    Thread Starter diaweb

    (@diaweb)

    Thanks for your help. It is fine now. ??

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Columns not working on mobile’ is closed to new replies.