Docs

[Nabeel A]

Hi again,

Thank you for providing the URL, please replace the above code with this:

.x-card-outer.flip-3d .x-card-inner {
    -webkit-transform: rotateX(-0deg) !important;
    -ms-transform: rotateX(-0deg) !important;
    transform: rotateX(0deg) !important;
}

Let us know how this goes!

[lindsayfaas]

hello? haven’t heard back in a while

[Paul R]

Hi,

It looks like you missed our last reply.

Have you tried the code provided above?

.x-card-outer.flip-3d .x-card-inner {
    -webkit-transform: rotateX(-0deg) !important;
    -ms-transform: rotateX(-0deg) !important;
    transform: rotateX(0deg) !important;
}

Hope that helps.

[lindsayfaas]

thanks, my bad.
Ok, so I put the code in and it works! stops all cards from flipping. However I only want one specific card right now to not flip. So I tried this. I added the number 1 to the above codes ID so it came out

..x-card-outer.flip-3d .x-card-inner1 (then all the rest of the code)

I then put that in the class and id fields of the specific card I’m trying to not flip. That didn’t work. Am I on the right track and just did the process wrong?

[colorcom]

I’m developing a website using X Theme and it’s not live yet. Am hoping that I’m using the card element correctly when I add an image (not an icon). The card looks great when I preview the page, but when I’m editing the page the full background doesn’t show. When I hit refresh it looks okay in edit mode. Before I launch the site, I was wondering if there’s a special tag I should use to make the card large enough for the image.

[Christopher]

Hi there,

@lindsayfaas

The code should be :

.x-card-outer.custom-card.flip-3d .x-card-inner {
    -webkit-transform: rotateX(-0deg) !important;
    -ms-transform: rotateX(-0deg) !important;
    transform: rotateX(0deg) !important;
}

@colorcom

please open a new thread and provide us with URL and login credentials.

Hope it helps.

[lindsayfaas]

ok code is in. What do I put in the class or id field to make it use it? I tried the “title” of the above code but that didn’t work.

[Lely]

Hi There,

From the previous CSS code, please add custom-card class.

Hope this helps.

[lindsayfaas]

Voila! It ended up creating a bug with the icon code from page 1 of this topic, but I just renamed the noflip code to .custom-card2 and put the appropiate class names on the appropiate pages for one to have the icon and flip, the other to have no flip and no icon.

[Rue Nel]

Hey There,

We are just glad that you have figured it out a way to correct the said issue.
Thanks for letting us know!

Best Regards.

[Author]

Posts