Format Shown Values of Slider Choices | XM Community
Skip to main content
I have sliders with selected values displayed on the left hand side. I would like those displayed values to be bold, and also add a "%" sign after the displayed values. How do you format the displayed slider values so that they are bolded and is followed by a % sign?
> @1ag0 said: > I have sliders with selected values displayed on the left hand side. I would like those displayed values to be bold, and also add a "%" sign after the displayed values. > > How do you format the displayed slider values so that they are bolded and is followed by a % sign? Do you mean the right hand side? (as in a Non-mobile friendly Slider or a Constant Sum slider). CSS: ``` .Skin .horizontalbar table.sliderGrid tr td.value input[type=text] { font-weight:bold; width:2.1em; } .Skin .horizontalbar table.sliderGrid tr td.value:not(:first-of-type)::after { content: "%"; font-weight: bold; } ```
Hey TomG, Thank you! This worked! Quick follow-up, is there a way to apply this to some sliders but not others?
> @1ag0 said: > Hey TomG, > > Thank you! This worked! Quick follow-up, is there a way to apply this to some sliders but not others? Instead of putting it in the Look & Feel, put it inside a `<style>` tag in the question text on the page(s) where you want a slider to be formatted this way.
Many thanks for this! Quick follow-up, the values are displayed, but they are being cut-off on the right-hand side. Is there a way to adjust it so that display values are not being cut off?
> @1ag0 said: > Many thanks for this! > Quick follow-up, the values are displayed, but they are being cut-off on the right-hand side. Is there a way to adjust it so that display values are not being cut off? It is somewhat theme dependent. You can try making width:2.1em; a bit bigger, but if you make it too big it will wrap.
TomG, Thanks for your reply! I have been playing around with the width, but as you said the slider values skips to the next line. Is there a way to disable the wrapping or is there a way to expand the content area?
> @1ag0 said: > TomG, > > Thanks for your reply! I have been playing around with the width, but as you said the slider values skips to the next line. Is there a way to disable the wrapping or is there a way to expand the content area? Yes, but I think you would be going down the rabbit hole with that approach. As easier solution would be to un-bold or reduce the size of the font.