CSS in Qualtrics questions

Qualtrics allows in-line Cascading Style Sheets (CCS) in their questions. It’s useful for tweaking the way questions are visually formatted. These are a few CSS formats I keep handy.

The statements in a matrix question:

<p style="margin-top: 3px; margin-bottom: 3px;">The way <b>competitors</b> might respond to the product if it is launched</p>

The response scale in a matrix question:

<p style="margin-bottom: 3px; margin-top: 0px;">Strongly <br><b>Disagree</b></p>(1)
(2)
(3)
(4)
(5)
(6)
<p style="margin-bottom: 3px; margin-top: 0px;">Strongly <br><b>Agree</b></p>(7)

Guidepost text:

<p style="color:black; background:PaleTurquoise; font-weight:bolder">&nbsp;Next, a few questions for statistical purposes only</p>

Question instructions:

<span style="font-size:75%">(Please choose one answer in each row)</span>

Piped questions:

<p>For <strong>thought #1</strong>, you wrote this:</p>
<p style="margin-left:20px;margin-right:20px;margin-top:5px;margin-bottom:5px;padding: 5px; border-style:solid;border-width:1px;border-color:silver;">${q://QID200/ChoiceTextEntryValue}</p>

In-text strong emphasis:


In the space below, please enter your <span style="color:#FFFF00; 
font-size:150%; background-color:#00008B; border: 5px; 
border-style:double; border-color:#FFFF00;">
 password </span>:

In the space below, please enter your  password :

 

– Eric DeRosia