Vertical Alignment of Partner Logos (CSS3 Solution)

Hi,

This is a reply to a closed thread and I want to share in case anyone else needs an answer. Original thread: https://kriesi.at/support/topic/vertical-alignment-of-partner-logos/

Vertical aligning of partner logos IS INDEED possible with PURE CSS3, and as a bonus, if the last row of logos doesn’t match your column count, the columns will fit the width of the slider. And it should be mobile-ready, though you may want to adjust for various viewports.

Here’s the CSS implementation:

.avia-content-slider-inner .slide-entry-wrap {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}
.avia-content-slider-inner .slide-entry-wrap .slide-entry {
	flex:1 1 0;
}
/* Optional: you might want to force a max-width on the images to make it look less cluttered */
.avia-content-slider-inner img {
	max-width:150px;
	height:auto;
}

It would be nice if mods leave replies open on all tickets (what’s the hurry ;-)) so we don’t have to create a new thread for follow ups.

Thanks for reading!
Andy