Need help to align the column in a side by side question | XM Community
Skip to main content

Hello Everyone,
I am need of help to align the columns in a side by side question.
The below are the scenario for a side by side questions in the survey i am building, there are four possibilities.
1) Label + 2 Choice (Drop Down List)
2) Label + 2 Column (Free Text)
3) Label + 1 Column (Free Text) + 1 Choice (Drop Down List)
4) Label + 1 Column (Free Text)
Can someone please help with a Javascript with which i can define the width for the Question Label, Free text box etc..

Qualtrics Help.PNG
When i inspect the elements, sometime i see the code with WidthStrut, in somecases i dont see them, there is style element with width in %

I have Added this javascript at the question level :
var lwidth = "250px";    //width of labels
var cwidth = "350px";    //width of labels
jQuery("#"+this.questionId+" tr.Headings"+" .WidthStrut").css("width", lwidth);
jQuery("#"+this.questionId+" th.SBS1"+" .WidthStrut").css("width", cwidth);

In Qualtrics Preview, when i inspect the element the below is what i see. Can someone tell me what i am doing wrong ?


In Computed i see the width to be 352px, not using he below width of 250px as defined

 
 
Test Test
 


The width of each column can be changes by dragging the line next to it.
image.png

https://www.qualtrics.com/community/discussion/14720/need-help-to-align-the-column-in-a-side-by-side-questionHi, I run into asimilar issues. Have you found out the solution?

Ada114,

This is the code i used :
In the header question of the page i used the below:

i set the page width to 1100 PX. Then the following code at the question level for each side by side question.
----------------------
jQuery("#"+this.questionId+" td.c1").css("width", "260px");
jQuery("#"+this.questionId+" th.SBS1").css("width", "40%");
jQuery("#"+this.questionId+" th.SBS2").css("width", "40%");   

For Column 1 i set it 260 PX as based on the description size (shorter or longer - this will stay fixed). so the Side by Side Question choices will use the rest of the space based on %

Leave a Reply


Terms & Conditions