Unlock a world of possibilities! Login now and discover the exclusive benefits awaiting you.
Hi I have just started using Multi KPI need help in reducing the space between 2 measures.
Right now its looking like this with this CSS. Need Help with figuring out how to reduce the whitespace
div[tid="UjgXn"] * {
padding:0 !important;
border-style: none !important;
}
div[tid="UjgXn"].value *{
padding:0 !important;
vertical-align: text-top; !important;
}
div[tid="UjgXn"].label*{
padding:0 !important;
}
I'm a very advanced Qlik and CSS developer and I was never able to reduce the padding in Qlik charts. Will be nice to see if someone had figured that out.
I've tried all different CSS attributes nothing seem to work
You need to find the class or identifier belonging to the single object containing number '27' and see its padding and margin attributes. If it is all "0" you also need to check the container that contains the percentage, in your case "-100.0%".
To do this, however, I recommend that you use Google Chrome's "Inspect" and with the console arrow point to the element you have created (example in screenshot).
Let me know if you are happy with it and if you can do everything I indicated above.
Thanks
Hi @gomeri,
based on your explanation i've found these..
So I've tried the following but nothing seems to be shifting
div[tid="UjgXn"] .ui.two.statistic. ui.one.normal.statistic. ui normal.statistic. value*{
padding:0 !important;
}
div[tid="UjgXn"] .ui.two.statistic. ui.one.normal.statistic. ui normal.statistic. span*{
padding:0 !important;
}
Hi @Keitaru,
have you tried reducing the style property 'flex-basis' to 25% or something similar?
it is necessary to understand how the two objects are inserted within the div block and how styles have been assigned to the two objects.
Alternatively, you can reduce the inner margins of the individual elements of the object using e.g. 'margin:--25px'
div[tid="UjgXn"] .ui.two.statistic. ui.one.normal.statistic. ui normal.statistic. value*{
padding:0 !important;
margin: -25px;
}
div[tid="UjgXn"] .ui.two.statistic. ui.one.normal.statistic. ui normal.statistic. span*{
padding:0 !important;
margin: -25px;
}