Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • November 18, 2014 at 5:11 am #352832
    djshortkut

    I need some help with the masonry gallery on my site. Support gave me some Quick CSS (See below) to remove the 1 pixel gap on the right side of the screen but when I updated to Enfold version 3.0.2 the code stopped working. (See image) Can you help me fix this issue? Thank you!

    @media only screen and (min-width: 1800px) {
.responsive.html_stretched .av-masonry-entry {
width: 16.68%;
}
}
    November 19, 2014 at 2:05 pm #353647
    Ismael

    Hey djshortkut!

    Thank you for using Enfold.

    Please replace the code with this:

    @media only screen and (min-width: 1800px) {
.responsive.html_stretched .av-masonry-col-flexible .av-masonry-entry {
width: 16.68%;
}
}

    IMO, I don’t think users / visitors will even recognize the gap.

    Regards,
    Ismael

    November 19, 2014 at 8:25 pm #353940
    djshortkut
    This reply has been marked as private.
    November 20, 2014 at 11:07 am #354194
    Ismael

    Hi!

    You can set the default width of the masonry entry:

    @media only screen and (min-width: 990px) and (max-width: 1024px) {
.av-masonry-entry {
width: 33.33%;
}
}

    This will actually depend on the number of items that you have. What if you have 7 items in there? This modification will only create a third row and another gap on the right side. Use css media queries to adjust the size on different screen sizes until you’re satisfied.

    Regards,
    Ismael

    December 1, 2014 at 10:03 pm #361085
    djshortkut

    That worked, thank you! You can mark this as resolved.

  • Author
    Posts
Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘Masonry Gallery 1px Gap’ is closed to new replies.