Columns same/equal height

  • Resolved clinic

    (@clinic)


    3 years, 3 months ago

    Hi, it’s there a chance to set columns in Testimonials same height? as at this moment if I got for example 3 of them and one got less text than other two, it’s shorter.

    The page I need help with: [log in to see the link]

Viewing 3 replies - 1 through 3 (of 3 total)
  • Plugin Author Yoga

    (@yogajegstudio)

    3 years, 3 months ago

    Hi @clinic

    This might require custom css.
    To do this, go to Dashboard->Appearance->Customize->Additional CSS and add this css codes :

    .guten-testimonials .swiper-wrapper {
	align-items: stretch;
}

.guten-testimonials .swiper-wrapper .swiper-slide {
	height: auto;
}

.guten-testimonials .guten-testimonial-item, .guten-testimonials .testimonial-box {
    height: 100%;
}
    Thread Starter clinic

    (@clinic)

    3 years, 3 months ago

    Thanks for reply, yes this works 🙂 but I forgot something, because I got below this section another section with is also testimonials, the one below it’s stretched and cut part which I don’t want to, it’s there option to limit this CSS only to that first section where I got doctors but not use this CSS on part where I got 3 swinging reviews?

    Pradnya

    (@pradnyajegstudio)

    3 years, 3 months ago

    Hi @clinic

    Please try to change with this CSS. guten-MNO08q, guten-LpNvD0, guten-gmcXzA are your testimonial element ids on the first section. So it will only apply on that testimonials.

    .guten-testimonials.guten-MNO08q .swiper-wrapper, .guten-testimonials.guten-LpNvD0 .swiper-wrapper, .guten-testimonials.guten-gmcXzA .swiper-wrapper {
	align-items: stretch;
}

.guten-testimonials.guten-MNO08q .swiper-wrapper .swiper-slide, .guten-testimonials.guten-LpNvD0 .swiper-wrapper .swiper-slide, .guten-testimonials.guten-gmcXzA .swiper-wrapper .swiper-slide {
	height: auto;
}

.guten-testimonials.guten-MNO08q .guten-testimonial-item, .guten-testimonials .testimonial-box, .guten-testimonials.guten-LpNvD0 .guten-testimonial-item, .guten-testimonials .testimonial-box, .guten-testimonials.guten-gmcXzA .guten-testimonial-item, .guten-testimonials .testimonial-box {
    height: 100%;
}
Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Columns same/equal height’ is closed to new replies.