Hi All! I am teaching myself how to write CSS code for qualtrics surveys and so far not doing too badly (thanks to this community). Where I am primarily stuck is knowing what the label (skin) names are for each of the question types and elements.
I have listed some of them below and I am sort of figuring out what each of these elements represent, but it is hit or miss in some cases. I also find that I am missing some, or unable to change certain things. there must be a master reference list somewhere, yes? Can someone help?
.Skin .InputText
.Skin label.MultipleAnswer
.Skin label.MultipleAnswer.q-focused
.Skin label.SingleAnswer
.Skin label.q-checkbox
.Skin label.q-radio
.Skin .Matrix .table-cell
.Skin .q-matrix .answered-indicator span
.Skin .q-matrix .table-cell
I’d love a comprehensive reply to this!
I’d love a comprehensive reply to this!
I do think there’s a master reference list somewhere but it should be a Qualtrics internal document. I mean they have their own customize service, can’t public that element list.
Meanwhile we just gonna inspect everything with F12, a little investigation.
You can view the entire stylesheet if you want by inspecting an element with F12 and then opening the stylesheet.css in a new browser tab. Below is the one in place for the surveys on the Qualtrics template page.
https://qwebsite.qualtrics.com/jfe/themes/skins/qwebsite/qxm_2/version-1649633096689-bd2e94/stylesheet.css
To see the parsed/beautified version of the stylesheet, just click on the stylesheet.css to view in the Sources tab of the Developer Console instead of opening in a new browser tab. Or, hit F12 to open the Developer Console, go the the Network tab, filter for CSS requests, and then Preview. You might need to Ctrl+R in this view to record the loading of the stylesheet.
Also, using Developer Console in Chrome, you can click the 3 vertical dots in the top right, then "More Tools", then "CSS Overview" to get an idea of how many Style rules are in place, various colors being used, etc.
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.