vertical alignment and uniform sizing

[wilhalphoto]

Please take a look at the attached screenshot. I am using a KLEO Post Carousel to display those “posts”.

How can I modify the display so each displayed image is:

1. vertically centered
2. sized uniformly (for example, maximum height = 250px)

Please advise. Thank you!
-Will

Attachments:

You must be logged in to view attached files.

[Kieran_SQ]

Hi,

You can use the below CSS to force a max height on the image of 250px. You can add this to Appearance > Editor > KLEO Child > Style.css or to Theme Options > General Settings > Scroll to: Quick CSS

.kleo-carousel .post-image img {max-height: 250px !important;}

However this CSS will only go so far, the images appear to be somewhat different sizes, you should create a template image for the size desired and resave each logo positioned within the new sizing template to make it look great.

Thanks,

Kieran.

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[wilhalphoto]

Hi,

Thanks for a very prompt reply.

But, I don’t want to do this for the entire site. Only for that particular container.
And, what’s the solution for vertical alignment.

thanks!
-will

PS: I’m pulling those images from external links so i’m hoping they can be proportionally resized before being displayed.

[Kieran_SQ]

Hi,

To target that container only please go into WP Admin > Page > Row > Edit and assign a custom ‘Element ID’. Once you have done this you can add it before the CSS stated above to target only that element.

#mycustomid .kleo-carousel .post-image img {max-height: 250px !important;}

For the vertical alignment and dynamic scaling I will ask my colleague @Radu to look into this for you, they’ll be in touch ASAP Mon-Fri East European Time.

Thanks,

Kieran

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

If you like the theme or the support you've received please consider leaving us a review on Themeforest!

Custom development requests can be sent to dev@seventhqueen.com, one of the development team will be happy to discuss your needs.

[wilhalphoto]

OK. Thanks!
I’ll be waiting for Radu’s answer for the other problem.

-will

[Radu]

Hi,

did you have tried those options from the row options ?

Tried with some css but nothing reliable… try those options please

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[wilhalphoto]

Yes, I did try them (any combination: one at a time and both of them at the same time), but the items are still positioned at the top.

Thanks!
-Will

[Radu]

Hi,

Tried again CSS solution but it’s hard to make that to be align if the images has different ratios

Wide image : https://i2.wp.com/everychildinc.org/wp-content/uploads/2016/08/every-child-inc-sticky-logo.png?zoom=2&w=1200&ssl=1

Portrait image : https://i2.wp.com/www.newsunrising.org/wp-content/uploads/2015/04/NSR-Logo-web.png?zoom=2&w=1200

So my suggestion it’s to choose all images to have same ratio, and for images wide add them in photoshop in a size like this : https://i2.wp.com/www.newsunrising.org/wp-content/uploads/2015/04/NSR-Logo-web.png?zoom=2&w=1200

Cheers
R

Hi there!!! Help others from the community and mark any reply as solution if it solved your question. Mark as a solution

What support service includes ? What not ?

[Author]

Posts