CSS - Charts - Legend - RTL

Hi all (and mainly the CSS-master @ThinhDinh),
I’m struggling to align the text inside the legend-item class. I’ve tried playing with the legend-title and legend-value, I’ve tried text-align, padding, width and more. Couldn’t find the correct combination. This is the closest I got, which brings both these classes to crash into each other

The idea is to have the title on the right and the value on the left. Should be a mirror image of the below (below is the default view, no CSS at all):

How do you want it to look like? Color and text on the right and number on the left?

Thanks my friend

Here you go.


div[id*="screenScrollView"] .legend-item {
direction: rtl;

div[id*="screenScrollView"] .legend-title {
padding-right: 5px;

div[id*="screenScrollView"] .legend-value {
margin-right: auto;
margin-left: 0;

Wow, that’s amazing. Working perfectly!
Thank you

1 Like

This topic was automatically closed 24 hours after the last reply. New replies are no longer allowed.