-
Posts
-
Hi dear Kriesi Team!
I’m facing this error from time to time when I use your theme for one of my clients. Currently I’m working on my own website and discovered this error again.
It seems that the padding-bottom is the reason for this in the masonry list.
I found different bottom paddings by inspecting the site with the firefox developer tools.Maybe you have a solution for this problem. I searched the forum and found similar problems but not with solutions that would help me.
Is there something I can do? Thank you very much!
ThomasHey Ink_Eye,
Thank you for the inquiry.
The padding property sets the aspect ratio of the images, so with 80% bottom padding, the aspect ratio would be 5:4 and with 160% padding, aspect ratio would be roughly 9:16 which is the portrait mode. You can learn more about it in the following article.
// https://css-tricks.com/aspect-ratio-boxes/
The class attribute of the masonry items are automatically assigned based on the width and height of the original image, so very tall images will be in portrait mode and those that are very wide are usually in landscape mode.
Best regards,
IsmaelHi Ismael,
thank you for your reply. I understand this. But how far I understand the theme: When I select the option “perfect manual masonry” the padding and margin should be the same for each portfolio item shown. In this case they are different. I do not know why.
Best regards, Thomas
Hi,
Do you see any layout issues because of these padding? The layout of the page looks fine on our end — the masonry items are resizing accordingly.
the padding and margin should be the same for each portfolio item
If you want the items to have the same size, set the Size Settings to Perfect Grid, and as we have mentioned earlier, the theme automatically applies padding to each masonry item to control their aspect ratio. The padding value is calculated based on the size and aspect ratio of the featured image.
When I select the option “perfect manual masonry”
Please check the description of the size settings for more info.
Perfect Manual Masonry: Manually control the height and width of entries by adding either a “landscape” or “portrait” tag when creating the entry. Elements with no such tag use a fixed default size, elements with both tags will display extra large
Best regards,
IsmaelHi Ismael,
thank you for your reply. Yes I see layout issues.
To make it a bit more clear I attached two additional photos and described the photos I uploaded before.
The two new photos: I put a number to each report of India.Please take a closer look at the screenshots. I hope you can help me.
Thank you! Best regards,
ThomasHi,
Thank you for the info.
That is not issue with the padding. Unfortunately, we can’t control the sorting order of the masonry items because the isotope script automatically calculates their position based on the size of the featured image relative to the next and previous items and some other factors. You may need to switch to the Perfect Grid option if you want the items to be arranged based on their actual order in the dashboard or based on the orderby settings
I’m confused about the numbers shown by the Chrome Dev Tools:
This has a border padding of 542.938:
https://thomas-urbany.com/wp-content/uploads/2020/05/Bildschirmfoto-2020-05-31-um-17.53.28.pngThe value of the bottom padding is 80% of the actual height of the featured image or the masonry item. Again, this is set to control the aspect ratio of the item. You can play around with the value of the bottom padding to see how it affects the aspect ratio.
Best regards,
Ismael
- You must be logged in to reply to this topic.