Tagged: Masonry Gallery
-
AuthorPosts
-
January 24, 2024 at 1:50 pm #1431899
Hi all,
I ve got a question regarding white spaces to create a more interesting view in my opinion.
When creating a masonry gallery the top pictures all align on the first row. I would like some pictures to be lower and some stick out relative to the rest. Working with eg a top margin would probably push the first picture over the one below it and on a small screen, it would create empty space above the images, any ideas or tips? Thanks, Frank.I would like something like this.
Second question, I was hoping the masonry gallery would have the option to create a template, so the settings like, link title showing on hoover, gallery 4 columns wide etc would be set in a template. When I however use the tab customize and save a customized setting, the settings don t seem to run on a new page. Is that not created for that purpose?
- This topic was modified 10 months, 2 weeks ago by liesbethp1.
January 25, 2024 at 6:52 am #1431958Hey liesbethp1,
Thank you for the inquiry.
1.) You can add this css code to adjust the margins around a specific masonry item.
.av-masonry-container .av-masonry-entry:nth-child(2) { margin-top: 200px; } .av-masonry-container .av-masonry-entry:nth-child(4) { margin-top: 100px; }
The css code above should affect the first and third items in the gallery.
2.) Have you tried creating a Custom Elements Template for a Masonry Gallery? Please check the link below for more info.
// https://kriesi.at/documentation/enfold/custom-element-templates/
Best regards,
IsmaelJanuary 25, 2024 at 4:18 pm #1432043That works, thanks, only thing, it changes all the galleries, can i not target individual items?
January 26, 2024 at 9:35 am #1432102Hi,
Thank you for the update.
You can apply a custom css class name or ID attribute to the Masonry element and adjust the css rule accordingly. Please check the link below.
// https://kriesi.at/documentation/enfold/add-custom-css/#enable-custom-css-class-name-support
Best regards,
Ismael -
AuthorPosts
- You must be logged in to reply to this topic.