Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
JohnS123

7.1 Masonry Grid: Maintain 2 Columns in Mobile

Question

Has anyone had any coding luck maintaining two columns at the 576 breakpoint when using the masonry grid? I've found plenty of answers for the grid-only, but not masonry.  Is this even possible based on how the images reorder at that size?

Thanks

Share this post


Link to post

1 answer to this question

Recommended Posts

  • 0
@media only screen and (max-width: 640px) {
    .gallery-masonry .gallery-masonry-wrapper {
        columns: 2;
        column-gap: 0;
        height: auto!important;
        display: block!important;
        padding: 0px;
    }
    .gallery-masonry-item-wrapper {
        height: auto!important;
    }
    .gallery-masonry-item {
        position: relative!important;
        transform: none!important;
        width: 100%!important;
        display: block;
        padding: 1.5px!important;
        box-sizing: border-box;
    }

    .gallery-masonry .gallery-masonry-item img {
        height: 100%!important;
      	width: 100%!important;
    }
}

This is what I have so far. Problem is the column are out of order. I'd really like someone to figure that out.

Share this post


Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...