CSS for only some background cards

This is very nice! Thanks for sharing.

1 Like

That’s terrific, @Manu.n!!!

1 Like

Nicely done @Manu.n.

Is this CSS basically taking the card image and making it an underlay to the card?

2 Likes

Hello @Robert_Petitto
yes I use the Data Image, you can put a standart image like this example:

image

I’m not 100% sure I understand you :wink:
But the principle is simple:

  1. fit the image size to the container
  2. move the “Bottom Area” up

You have a copyable demo app

1 Like

Yeah this is true. I believe we had the same thought originally on this topic. This works and is terrific, but it’s not exactly the conditional CSS we were looking for.

Let’s say I want cards that don’t have an image not rendering the image space, while those that have one will render. That’s the one thing I believe is conditional CSS and want to apply.

1 Like

Hello @ThinhDinh

Sorry for not being able to make your wishes come true :wink:

the Card structure does not allow conditional CSS.
You can only do conditional for “Role” type tags, like an “Aria-checkbox” for example, which has an “aria-checked” attribute. I have already used this method for my CSS “UpDown” CSS Up/Down for Visibility

1 Like

Don’t worry bro your work have always been terrific! I learn a lot from your samples and applied them to my apps.

Have a nice week.

2 Likes