[Resolved] Loop layouts, two columns layout on mobile

Home Forums Support [Resolved] Loop layouts, two columns layout on mobile

Home Forums Support Loop layouts, two columns layout on mobile

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • #792650
    Carsten

    Hi there, on desktop I have a three columns layout of my buddypress members directory.
    Customize>Buddypress>Loop layouts> Members >Three columns layout

    On Mobile, this turns into a one column layout. I would like to have a two column layout on the mobile, how do I achieve this?

    Regards
    Carsten

    #792736
    David
    Staff
    Customer Support

    Hi there,

    This is out of our scope. But if can you provide a login so we can see the Site then we may be able to assist with some CSS.

    #792856
    Carsten

    Thank you David, the login information is send under Account Issue.

    I am sorry if this is not theme related, I thought so, as the loop layouts is part of dashboard>appearance >customize. But I appreciate if you will take a look at it.

    Thanks

    #792977
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Did you get this sorted? I’m seeing 2 columns on mobile: https://www.screencast.com/t/FkYAYc7B

    Let me know πŸ™‚

    #793215
    Carsten

    Hi Tom, thanks for your interest,

    In vertical position, I only have one column.

    View post on imgur.com

    #793258
    Tom
    Lead Developer
    Lead Developer

    Ah, on super small screens.

    Try adding this CSS:

    @media (max-width: 500px) {
        .grid>li.item-entry {
            float: left;
            margin: 0;
            width: 50%;
        }
    
        .grid.three>li:nth-child(odd), .grid.two>li:nth-child(odd) {
            padding-right: 10px;
        }
    }
    #793463
    Carsten

    Hi Tom, if you consider the iPhone 6/7/8 screens as super small, then yes πŸ˜‰

    It worked out perfectly, this was exactly what I was looking for.

    Thanks for your help!

    Regards
    Carsten

    #793720
    Tom
    Lead Developer
    Lead Developer

    You’re welcome πŸ™‚

Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.