Tagged: , , ,

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • February 8, 2023 at 5:55 pm #1397206
    spooniverse

    Dear support team, I’m currently installing the update to 5.4 on various homepages. This works fine, but I have the impression that there is a bug with the margin in the Masonry element.

    In masonry_entries.min.css?ver=5.4 on line 153 the code says:

    #top .av-inner-masonry {
 overflow:hidden;
 background-color:transparent;
 margin:0
}

    However, the margin:0 causes the entries to line up without spacing. The problem only occurs with “flexible masonry” enabled. All settings related to spacing (“no spacing”, “1px spacing”, “large spacing”) are ineffective if “flexible masonry” is the chosen option for the Masonry element.

    I helped myself by adding the following code in the stylesheet: 

    #top .av-inner-masonry {
  margin: 0 15px 15px 0;
}

    This gives me the “large spacing” again as before.

    If I see it right this problem does not come from my other styles. I had removed everything from my stylesheet and the spacing between the masonry entries is always missing when the “flexible masonry” setting is selected.

    Is this a bug? Do others have the same problem? I can help me with my CSS snippet for now, but still wanted to share the circumstance and appreciate a short response. Thank you very much.

    All the best, Daniel

    February 9, 2023 at 3:59 am #1397254
    Ismael

    Hey spooniverse,

    Thank you for the inquiry.

    This css rule should be applied when flexible masonry and large gap are enabled.

    .av-large-gap.av-flex-size .av-masonry-entry .av-inner-masonry {
    position: relative;
    margin-right: 15px;
    margin-bottom: 15px;
}

    Do you see this code in the css file around line 322?

    Best regards,
    Ismael

    February 9, 2023 at 8:58 am #1397275
    spooniverse

    Hey Ismael,

    I have flexible masonry and large gap enabled but there is no gap. Even if I choose the 1px gap. I found the code you mentioned in line 243:

    .av-large-gap.av-flex-size .av-masonry-entry .av-inner-masonry {
 position:relative;
 margin-right:15px;
 margin-bottom:15px
}

    But the code on line 153 with the #top is stronger and therefore the gap is missing. On line 153 it says:

    #top .av-inner-masonry {
 overflow:hidden;
 background-color:transparent;
 margin:0
}

    So shouldn’t the code on line 243 be like:

    #top .av-large-gap.av-flex-size .av-masonry-entry .av-inner-masonry {
 position:relative;
 margin-right:15px;
 margin-bottom:15px
}

    Or the code on line 153 should be without the #top in the beginning.

    Or am I wrong?

    Thanks for your fast response!

    February 9, 2023 at 11:38 am #1397289
    Yigit

    Hey,

    Please add following code to bottom of Quick CSS field in Enfold theme options > General Styling 

    
#top .av-1px-gap.av-flex-size .av-masonry-entry .av-inner-masonry{
	margin-right: 1px;
	margin-bottom: 1px;
}

#top .av-large-gap.av-flex-size .av-masonry-entry .av-inner-masonry{
	margin-right: 15px;
	margin-bottom: 15px;
}

    So shouldn’t the code on line 243 be like:

    Yes and we have fixed that issue and it will be included in upcoming version :)

    Best regards,
    Yigit

    February 9, 2023 at 11:48 am #1397294
    spooniverse

    Hi Yigit, thanks for letting me know and for the quick fix. I will wait with my ongoing updates on further websites until the next version is rolled out. You may close this.

    February 9, 2023 at 12:14 pm #1397302
    Mike

    Hi,
    Glad Yigit could help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

    Best regards,
    Mike

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)
  • The topic ‘Bug in Masonry Element with Enfold 5.4 ?’ is closed to new replies.