Position and size adjustment for stars | XM Community
Solved

Position and size adjustment for stars

  • 4 September 2018
  • 5 replies
  • 249 views
E
Badge +1
Hi everyone,
I'm pretty new to Qualtrics and JavaScript but need to make some adjustments to a star rating question.
How can elements (e.g. sliders/stars) be aligned within the page (e.g. centered horizontally) and adjusted in size (e.g. made bigger, keeping the aspect ratio of the stars)?
Thanks for your support!
Best,
Eva
icon

Best answer by MohammedAli_Rajapkar 5 September 2018, 03:48

View original

5 replies

sankeshkumar
Rank
Userlevel 3
Badge +1
Hello @EvaSch Can you help with some visual mode of your query..
E
Badge +1
Hi @sankeshkumar, here's a screenshot:
!

As you can see, the stars are left aligned (I want them to be centered) and I also would like them to be bigger.

Thanks a lot for your support!
Best,
Eva
MohammedAli_Rajapkar
Rank
Userlevel 7
Badge +20
You can center align it by adding below code in "Custom CSS". You can try increasing or decreasing the percentage value to adjust the position.

.Skin .ylabel {
width: 37%;
}

Regarding star size increase, not sure if we able to do it, however, the other way would be to reduce the font size of the question text so that the star looks bigger comparatively to font text.

!
Regards, Mohammed Ali
E
Badge +1
@sankeshkumar Thank you!
M
Rank
Userlevel 1
Badge +1
> @Mohammedali_Rajapakar_Ugam said:
> You can center align it by adding below code in "Custom CSS". You can try increasing or decreasing the percentage value to adjust the position.
>
> .Skin .ylabel {
> width: 37%;
> }
>
> Regarding star size increase, not sure if we able to do it, however, the other way would be to reduce the font size of the question text so that the star looks bigger comparatively to font text.
>
> !
>

This appears to position the stars to a certain % from a right alignment. I can get the stars to align on one screen size, but it is inconsistent across screen size changes.

Leave a Reply


Terms & Conditions