Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • August 18, 2019 at 5:41 pm #1128677
    kasperdue

    Hi

    I think I’m quite close to getting where I want,
    but can you help me the last part, please?

    On the page I have 6 pieces of 1/3 columns working fine on desktop.

    On mobile I wish to have them 2 and 2, side by side.

    So I’ve added a custom class to all 6 cells called: mobilesbs
    and the following css:

    @media screen and (max-width: 767px) {
    .mobilesbs {
    width: 50% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    }
    }

    However nr. 3 and nr. 6 column is placed alone on the right on mobile.

    Is there anyway to have 3 rows with nicely side by side 50% colums on mobile?

    Thanks in advance

    August 18, 2019 at 8:23 pm #1128713
    Victoria

    Hey kasperdue,

    Try using the code like this:

    
@media screen and (max-width: 767px) {
.mobilesbs {
    width: 50% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
    margin: 0 !important;
    clear: none !important;
}
}

    Best regards,
    Victoria

    August 19, 2019 at 12:05 pm #1128874
    kasperdue

    Thank you!

    Fast support. Works perfectly.

    Case closed :)

    August 19, 2019 at 12:32 pm #1128884
    Yigit

    Hi,

    Glad Victoria could help! :)

    For your information, you can take a look at Enfold documentation here – https://kriesi.at/documentation/enfold/
    If you have any other questions or issues, feel free to start a new thread under Enfold sub forum and we will gladly try to help you :)

    Best regards,
    Yigit

  • Author
    Posts
Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Column width 50% on mobile’ is closed to new replies.