Widen question background color | XM Community
Skip to main content

I used this code to change the question background color

jQuery("#"+this.questionId).css("background-color","#F5F5F5")

However, the color comes very close to the text. Is there a way to widen all the margins (top/bottom/left/right) so that there is more space between the text and the box?

Hello ​@Regan 

You can add padding and margin to create more space around the text.

Try this updated code:

Qualtrics.SurveyEngine.addOnload(function() {
    jQuery("#"+this.questionId).css({
        "background-color": "#F5F5F5",
        "padding": "15px", 
        "margin": "10px", 
        "border-radius": "8px" 
    });
});
 

Thank you, that worked great! What would I have to add if I also want to have a border around the box?

You just need to add the border property to your CSS inside the .css method. Try the updated code with a border added:

Qualtrics.SurveyEngine.addOnload(function() {
    jQuery("#"+this.questionId).css({
        "background-color": "#F5F5F5",
        "padding": "15px", 
        "margin": "10px", 
        "border-radius": "8px",
        "border": "2px solid #000"
    });
});

 

Leave a Reply


Terms & Conditions