CSS code in Multi KPI not working anymore (May_2021_Release)

[FabianF]

Hello,

since we installed the May_2021_Release the css code in our Multi KPI visualizations is not working anymore.

The following is used for the styles and worked properly. I would be glad if someone can help me here, since I am no expert in creating css code.

@Import url(" https://use.fontawesome.com/releases/v5.10.1/css/all.css ");

& *{
border-width: 2px;
border-color: #217217217;
overflow: hidden;
}
& .value {
font-family: Helvetica, Arial, Geneva, sans-serif;
}
& .label {
font-family: Helvetica, Arial, Geneva, sans-serif;
}

[mthernandezg]

We just installed the same version and are facing the same issue.  Have you found any solutions?

I found this link similar to this situation, but it is from an older version, not sure if someone has figured out how to fix this?

https://community.qlik.com/t5/Knowledge/CSS-styling-in-Multi-KPI-extension-stops-working-after-Qlik/...

[FabianF]

Hello Mthernandezg,

after a lot of trying the following way works for me:

1. Get the id of the object you want to change. To do so, add "/options/developer" to your url. After reloading the page rightclick on the  corresponding object and leftclick "Developer" to geht your objectID. 

2. Go to the "Styles (CSS)" box of your Multi KPI and add your CSS there. Replace the "& *" with your objectID "div[tid="YOUROBJECTID"] *

3. Add "!important;" after every property to override any other or default property.

Maybe this example helps you a bit more than my description:

@Import url(" https://use.fontawesome.com/releases/v5.10.1/css/all.css ");

div[tid="LNLCJY"] * {
border-width: 2px;
border-color: #217217217;
overflow: hidden !important;
}
div[tid="LNLCJY"] .value {
font-family: Helvetica, Arial, Geneva, sans-serif !important;
}
div[tid="LNLCJY"] .label {
font-family: Helvetica, Arial, Geneva, sans-serif !important;
};

[Tooor]

Great reply!

[jbhuck]

Hi,

Thanks for this answer.

We upgrade QS with Nov 21 version. We have the same problem.

It works good with "generic" tag like ".value", ".label".

But we used  .statistic-1 property.

And it doesn't work anymore (e.g. below).

Do you a solution for that ?

div[tid="9ddac5a1-3b2c-4e66-abf3-25e8aff43e35"] .statistic-1 .value * {
font-size: 48px; !important;
}

div[tid="9ddac5a1-3b2c-4e66-abf3-25e8aff43e35"] .statistic-2 .value * {
font-size: 12px; !important;
}

[Ken_T]

did anyone ever log a ticket with qlik on this? any updates?