Flipbox don't flip on Ipad

[marcel.wezenberg]

Hello,

I’m using the sportsman pro theme. I tried to use the flip boxes using the SKT Builder.
On the desktop PC with chrome or Edge they flip when the mouse is hovering over them.

But on the ipad they don’t work. I’ve three boxes on one row. One flips when clicking it, but I can’t flip it back.
The other two won’t flip at all.

Please let me know to solve this.

Kind regards,
Marcel

[Sonl Sinha]

Hi,

Kindly show us your website URL?

Regards,
Dave

[marcel.wezenberg]

Hello Dave,

The URL is: https://www.ijgv.nl/test2/sponsoren

Also for the backside text, I’ve difficulties to adjust the line-height.
See the most left flipbox backside text.

Kind regards,
Marcel

[marcel.wezenberg]

Hello Dave,

Please let me if there’s a solution for the flipbox issue on the ipad.

Thanks.

Kind regards,
Marcel

[Sonl Sinha]

Hi,

Kindly go to Appearance >> Customize >> Basic >> Scroll down to find Custom CSS and paste there:

@media screen and (min-width:768px) and (max-width:1023px)
.skt-builder-flipcard { height:550px;}
.skt-builder-flipcard .skt-builder-flipcard-front, .skt-builder-flipcard .skt-builder-flipcard-back { height:auto !important; min-height:550px;}
.skt-builder-flipcard-front-content p { margin-bottom:6px;}

Regards,
Dave

[marcel.wezenberg]

Hello Dave,

Thanks for the CSS code, indeed this improves the behave. Compared to a desktop PC, once a flipcard flipped you can’t return it to it’s default state. You’ve to click a different one. (Then the first one returns and the second one flips)
It this the expected behave of such flipcard (on tabled)?

I added a 4th one. (3 on a row) So I’ve two rows, those overlap. Is this a bug in the CSS somewhere?

Kind regards,
Marcel

[Sonl Sinha]

Hi,

Kindly use this one

.skt-builder-block-inner.skt-builder-block-inner-301 .skt-builder-column { height:550px;}

Regards,
Dave

[marcel.wezenberg]

Hello Dave,

Sorry to bother you again, I noticed the CSS you send controls the height of the flipbox that’s fine.

Meanwhile I found out that once I replace the icon with a picture from the media library the flipbox work better on the ipad. Even without any of the CSS code you send!

It seems you need to click the picture to flip it. (with an icon that didn’t work)
It would be nice if it flips already if you click within the flipbox area, not specific the picture.

Also to return it back to it’s default state, you need to click a different flipbox. To me that’s not very handy.
Is there a better way to return the flipbox to it’s default state. (click it again would be logic to me)

Kind regards,
Marcel

[Author]

Posts