Two Bugs in Card element

[dannikb]

I previously reported a bug in the Tab element where the paragraph tags are being stripped out when you don’t have a hard return in the text and edit via Rich Text view. I’ve discovered that the same thing happens in the Card element both on the Front Content and the Back Content. (Since I have custom CSS applied to the .p tag, this is a problem for me.

The second issue is that I cannot get the content on the back of the card to center vertically. I have flexbox setup identically for Front Content and Back Content, but the back content is top aligned. Both are set as:

The front content is centered vertically, but the back content is not.

[ruenel]

Hello Danni,

Thanks for writing in!

With the Card element, you are only suppose to insert plain text and then define what HTML tag you will use to wrap your text.

Things to keep in mind that:
1.) When using an <h{n}> tag, you do not need a hard return in Rich Text view
2.) Nesting a <p> tag inside any of the <h{n}> heading tag is not valid.
3.) Use Shift + Enter key to insert line breaks instead of hard return
4.) When using a custom HTML content, do not switch to Rich Text view

In you use several paragraphs, you will need to hack your way out of it.

Best Regards.

[dannikb]

Hi, I think the issue is different than what you addressed.
On the front of the card, the “HMTL Tag” field is set to <span> . In the content, I have the following:

and my flexbox settings are:

This all looks good and renders like this:

However, on the back content, I just have a single paragraph of content, so the “HTML Tag” field is set to <p> and the content looks like this:

(Note there are no html tags there at all. )

My flex box settings are the same as they are for the Front Content:

However, the back content looks like this:

There are two problems with it.
First, my custom CSS has the line height of .p tags set at 1.8. That’s getting picked up on the Front Content, but not the back. It does if I manually put in a <p> tag in the HTML view of the Back Content text, but then the tags get stripped out if you click on the Rich Text view. (This is the same bug I reported in the Tab element).

Second, the content is not vertically centered on the back of the card. Why would the same flexbox settings do that on the front, but not the back?

Thanks!

[ruenel]

Hello Danni,

Please provide us access to your site so we can check your Card element settings. There might also some CSS that is causing a conflict with the Card’s element styling. You can create a secure note in your next reply with the following info:
– Link to your site
– WP login URL
– WP username
– WP password
– WP Administrator Role
– Confirmation that we can access and make changes to your site

To know how to create a secure note, please check this out: How The Forum Works

Thank you in advance.

[dannikb]

Sending the info.

[ruenel]

Hello Danni,

This isn’t a bug. You need to do the following:

1.) Set the Vertical Alignment to the center:

2.) And then remove the bottom margin of your Back Button:

You should have something like this:

Best Regards.