Slick carousel - force slides to have the same height

As answered above.works fine on slick slider

.slick-track
{
    display: flex !important;
}

.slick-slide
{
    height: inherit !important;
}

but, i have an issue when using slick sync navigation

simple put below css to cover it.

.slick-slide {
    margin-bottom: 0;
    object-fit: cover;
}

Add a couple of CSS styles and it will be ready:

.slick-track
{
    display: flex !important;
}

.slick-slide
{
    height: inherit !important;
}

Enjoy! :-)

Ok guys i found an easy solution. Just add a setPosition callback function (fires after position/size changes) which sets the height of the slides to the height of the slider (slideTrack):

JS

$('.slider').slick({
    autoplay: false,
    dots: false,
    infinite: false,
    arrows: false,
    slidesToShow: 2,
    slidesToScroll: 2,
  rows: 0
})
.on('setPosition', function (event, slick) {
    slick.$slides.css('height', slick.$slideTrack.height() + 'px');
});

Dont forget that your slides need to have full height:

CSS

.slide {
  height: 100%;
}

Here is a little jsFiddle to demonstrate: https://jsfiddle.net/JJaun/o29a4q45/

The js solution from @JJaun is not perfect, because you see the height jumping if you use an background image for the slides. This worked for me:

.slick-track {
  display: flex !important;
}

.slick-slide {
  height: auto;
}