Xcard flip

[DennisHartmann]

Hey guys,

on my site konnex.gmbh/beratung…

there are two flip cards i need them on every device in same size… how can i do this…=?

thank u for ur awsome support.

[Joao]

Hi There,

Upon checking your website it seems you achieved your goal, both cards are the same size.

Let us know if you need further help!

[DennisHartmann]

Ye because i set a min height:
.x-card-outer.flip-3d .x-card-inner {
min-height: 450px;

but now it is on Desktop to big spaces it only looks good on mobile.

is there a opperutnity to make an min heigt for every device seperate

[rad]

Hi there,

It’s possible using @media query. Example,

@media ( max-width: 767px ) { /* mobile */

.x-card-outer.flip-3d .x-card-inner {
min-height: 450px;
}

}

@media ( max-width: 979px ) and ( min-width: 767px) { /* tablet */

.x-card-outer.flip-3d .x-card-inner {
min-height: 440px;
}

}

@media ( max-width: 1024px ) and ( min-width: 980px) { /* larger tablet */

.x-card-outer.flip-3d .x-card-inner {
min-height: 400px;
}

}

@media ( min-width: 1025px) { /* desktop */

.x-card-outer.flip-3d .x-card-inner {
min-height: 300px;
}

}

This is just a sample, you may change or create your own version of it.

Cheers!