I have two p-card in a component. I hope them have different background colors.
I used the following CSS code but this makes two p-card have same background color.
::ng-deep .ui-card {
background-color: lightblue !important;
}
Is it possible to make two p-card have different colors?
Thanks!
how to use different background color for two p-card?
-
- Posts: 449
- Joined: 08 Aug 2018, 14:09
Hi,accsoar wrote: ↑01 Nov 2019, 12:29I have two p-card in a component. I hope them have different background colors.
I used the following CSS code but this makes two p-card have same background color.
::ng-deep .ui-card {
background-color: lightblue !important;
}
Is it possible to make two p-card have different colors?
Thanks!
Can you try 'ViewEncapsulation.None' like this;
Code: Select all
@Component({
...
encapsulation: ViewEncapsulation.None
})
I don't understand, how changing the encapsulation will help to have different p-cards in the same component to have different background colors.
I have a similar problem, where I have to dynamically highlight a single p-card in a row of p-cards.
I tried several angles to tackle that problem but so far I was not able to come up with a working solution. My workaround is coloring a child-div, which is really not pretty.
Can someone tell us a dynamic way to set that background-color?
I have a similar problem, where I have to dynamically highlight a single p-card in a row of p-cards.
I tried several angles to tackle that problem but so far I was not able to come up with a working solution. My workaround is coloring a child-div, which is really not pretty.
Can someone tell us a dynamic way to set that background-color?
-
- Information
-
Who is online
Users browsing this forum: No registered users and 18 guests