hi,
in this i found how to make a hover overlay on portfolio items:
portfolio hover overlay
there is the method “top:50%” to vertically center the text, but that’s not working with multiple lined text, as it just pushes down the text (and doesn’t align it center)
here i found a solution to vertically center the caption with the “display:table / table-cell” method.
is it possible to use the second method instead the first one? if yes, how?
any suggestions?
Hey!
Can you please post the link to your page and post a screenshot showing the changes you would like to make so we can make sure that we are on the same page and provide you an accurate custom CSS code?
Cheers!
Yigit
i’d like to put the text vertically centered in the image hover overlay, not just pushed down.
Hi,
Please try the following in Quick CSS under Enfold–>General Styling:
.grid-image:before {
top: 40% !important;
}
Adjust the value 40 to your liking.
Thanks,
Rikard
unfortunately, that’s the same method as i described in the first post – this only pushes the top of the text but does not center vertically it. (so with different number of lines it won’t work correctly: either will a one-line text shown too above or a multi-line text too below the center.)
Hi,
Try the following instead:
.inner-entry a {
vertical-align:middle !important;
}
Thanks,
Rikard
thx, but not working, makes only the grid caption to align, not the overlay text.
on this site it’s done with a div and the table-cell method: http://peacheyphotography.co.uk/
or is that only with the masonry possible?
Hey!
not sure what you want and image overlay seems to be vertically aligned for me:
Can you provide us a mockup showing the result you want to achieve?
Cheers!
Andy