Right vs Left alignment for calculator results

Ask the Community Customization
1

We are using a calculator for users to enter the count of our 3 tiers of licenses. I want the total to be right justified so the Total at the bottom is lined up under the line item amounts. Like an invoice would be. Right now the values are not stacked.

2 Likes
3

Hi there and welcome to the Community, @user35614 :waving_hand:

This code should do the trick:

[class*='result-primary__PrimaryContainer-sc'] {
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}

Please add it to the Custom CSS field on the Settings tab of your widget’s settings and let me know if you like the result :slightly_smiling_face:

4

Thanks…

be2dcf39-618c-4820-bcb2-a5f9e1a5838a-spark-clipboard.png2710Ă—1070 163 KB

1 Like
5

Just to confirm, is it a result you wanted to achieve?

If you wanted to keep the current display and just move both calculation name and the result to the right, please use this code instead:

[class*="result-primary__PrimaryContainer-sc"] {
    text-align: right;
}

image
image1466Ă—768 32.1 KB

6

Yes, that was perfect. Thanks.

1 Like
7

Great, you’re very welcome!

In the meantime, we’d like to invite you to participate in our new contest, where you can win a 3-month extension for your subscription - April Contest: What’s Your Top Widget Feature? Tell us and win 3 MONTHS FREE!:wrapped_gift:

Check the details and join in :wink: