Okay
  Public Ticket #1804385
Mobile masonry online shows 1 row
Closed

Comments

  • martyroeters started the conversation
    December 1, 2018 at 10:20am

    Hi, 

    Currently the masonry gallery on mobile shows only 1 row.

    Is it possible to change this somehow to 2 rows, or perhaps 3 like on the desktop website?

    Would love the hear from you.


    Best 

    Martijn

  • [deleted] replied
    December 3, 2018 at 8:28am

    Hi Martijn,

    Can you please add the code below to your Custom CSS area:

    @media screen and (max-width: 768px) {
    .vc_grid-item.vc_col-sm-4 {
        width: 50% !important;
        float: left;
    }
}

    I wish you a great day!

  • martyroeters replied
    December 3, 2018 at 9:51am

    Hi,

    That does not work, see attachment.


  • [deleted] replied
    December 3, 2018 at 11:49am

    Hi Martijn,

    Ok then, please add the !important rule to the second code. The code should look exactly like this:

    @media screen and (max-width: 768px) {
    .vc_grid-item.vc_col-sm-4 {
        width: 50% !important;
        float: left !important;
    }
}
    It should work now.

    Thanks!

  • martyroeters replied
    December 3, 2018 at 1:12pm

    Hi Ylli

    This leaves empty gaps in between the images.

    Please have a a look at the attachment 

  • martyroeters replied
    December 3, 2018 at 1:12pm

    Here is the attachment :)

  • [deleted] replied
    December 3, 2018 at 2:26pm

    Hi Martijn,

    Ahh, it seems that this is impossible to do because WPBakery Page Builder plugin overwrites the code. Anyway, please write the plugin author for this question and see if they can help you in this custom question.

    I wish you a great day!