The Slider List question was built to accommodate relatively short row headers. If you find that you need to adjust the width of either the row header or the slider to accommodate your row header text you can do so with a little CSS!
Place the below CSS code in your survey theme. To do so go to the Style tab and scroll to the bottom of the survey preview to access the link for the HTML/CSS Editor. CSS code should be placed on the Custom CSS tab.
To reduce the width of the slider use the below CSS.
.sg-slider-box {
margin-left: 245px;
margin-right: 15px;
width: 250px;
}
To increase the width of the row header use the below CSS. We've increased the width to 150%.
.sg-slider-row-label-inner {
width: 150%;
}
Finally, if you would like to gain a touch more room you can pull the row headers to the left use the below CSS.
.sliderwidth .sg-question-options {
padding: .3em 1em 1em 0em;
}
Next, edit your Slider List question and go to the Layout tab and enter sliderwidth in the CSS Class Name field.
