-
AuthorPosts
-
July 15, 2017 at 11:34 pm #821865
I have a Portfolio grid which is displayed wonderful. The excerpt has different conent ==> different long.
In certain situation this causes a 2 line break for some items while the other remain on one line ==> positioning seems quite odd.
Is there a way to fix this issue?
Using 4.1.1.
thx
rolandJuly 16, 2017 at 2:23 am #821883Hey kwanumzen,
Your link seems to be down, unless you are blocking some IPs?
Please advise.Best regards,
MikeJuly 16, 2017 at 11:00 am #821949July 16, 2017 at 11:44 am #821967Hi,
the previous link should now work again…
rolandJuly 16, 2017 at 3:22 pm #822034Hi,
Well, the text in the middle section is longer that the space so it makes a second line. You could edit the excerpt to be shorter, or add more to the other two excerpts? How were you hoping this would be handled?Best regards,
MikeJuly 16, 2017 at 3:46 pm #822048Hi Mike,
What I would expect: That the borders for all 3 items cover the same height – i.e. the maximum height of one of the containers which holds the caption…
I made another screenshot (see below)
And from the new screenshot you clearly see that there is an overlapping ==> I would expect: no overlapping!
Does it sound reasonable?
kr
rolandJuly 16, 2017 at 4:27 pm #822067forgotten to mention: the second issue with the overlapping seems to occur only when the browser resize at once to a different window size which causes the different box-rendering…
July 16, 2017 at 4:40 pm #822075Hi,
Please include the url to the page in question so we can take a closer look and try to write some code for you. :)Best regards,
MikeJuly 16, 2017 at 4:46 pm #822080Hi Mike,
what do you mean with URL? I have it on my localhost. You can reproduce it or not?
I’ve tested it as well on https://webers-testseite.de/mino/portfolio-item/slider-two-third/ with the same behaviour… so, what do you need additionally???
kr
rolandJuly 16, 2017 at 4:51 pm #822085I’ve tested little bit this page ==> there the problem is the different length of the header, i.e. the header is longer than the Excerpt (=my case) but the issue remains a similar one (although perhaps the head lines height would be preferably all the same!)
July 16, 2017 at 5:06 pm #822088Hi,
Sorry I didn’t realize it was on your localhost, that will make writing custom code for you tricky as we try to target your page ID, div, element, and test on different screen sizes, etc. As I can’t tell what any of these are for your site, or the size of the largest element, I will try to guess :)
Try this code in the General Styling > Quick CSS field:.grid-content {min-height: 100px!important; }
adjust the 100px to suit.
Here is a screenshot of the demo:
Best regards,
MikeJuly 16, 2017 at 6:03 pm #822121Hi,
I found that
.grid-entry-excerpt,entry-content { min-height: 46px!important; display: flex; align-items: center; justify-content: center; }
gives the proper height of the content – cuz I need it only for the Excerpts (with some additional alignments). So far – so good – nevertheless two qs:
1) Is there a way to apply these settings only in the case when 2 lines are used?
a) dynamically (preferable)
b) hard coded (i.e. if the excerpt is smaller than …px) ==> use e.g. a special class which has these attributes…
2) What code is required to cause a revalidation of the layout? Cuz when I manually shrink the window by pixels the layout process is done perfectly. But when I click on the middle Windows-button each window has (left to close windoX) than the layouting is not done another time ==> what to do to apply resp call it?thx
rolandJuly 16, 2017 at 6:47 pm #822132Hi,
I don’t have a dynamic solution for this, other than when this occurs to offer some css to fix. It is typically very infrequent.
I’m not sure I understand the second question, but I think this is due to the browser calculating the sizes of the elements and when you resize the window the browser is not recalculating correctly. If you refresh the browser at any size it will calculate correctly.
Also note that in the coding, not everything is done in percentages of the browser window, many things are set to standard device widths and there are many odd widths between device sizes that might not look right. For example phones are 425px, tablets are 768px, so at 553px things might not look right, but there is no device that size :)
Hope this helps.Best regards,
MikeJuly 16, 2017 at 9:11 pm #822171Hi Mike,
I inspected the code more deeply and I would NOT say, the heights and measurments are due to browser calculation: The class
grid-entry
is calculated somehow cause theleft-position
as an absolute position as well as theheight
of thegrid-sort-container isotope no_margin-container with-excerpt-container grid-total-odd grid-col-3 grid-links-ajax isotope_activated
… so I think the calculation misses some special cases (e.g. rounding errors).But I would also guess that this calculation of the
positions
andheight
could also insert some additional classes if the calculatedwidth
below a limit…. Therefore I’m curious if there is a chance to have a more dynamically setgrid-entry-excerpt
.thx
rolandJuly 18, 2017 at 6:34 am #823106Hi,
1) Is there a way to apply these settings only in the case when 2 lines are used?
a) dynamically (preferable)I’m sorry but that’s not possible. Please hire a freelance developer or contact our partner, Codeable.
// http://kriesi.at/contact/customization
Anyway, I’m sure the excerpt will only break on certain screen sizes so adding a css media query, targeting those screen sizes, should work.
Best regards,
IsmaelMarch 7, 2018 at 11:19 pm #923436PLZ close this issue
March 8, 2018 at 6:12 am #923561Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.
For your information, you can take a look at Enfold documentation here
and the video tutorials here
And if there are features that you wish Enfold had, you can request them and vote the requested ones here
For any other questions or issues, feel free to start new threads under Enfold sub forum and we will gladly try to help you :)Best regards,
Mike -
AuthorPosts
- The topic ‘Portfolio items – Excerpt alignments…’ is closed to new replies.