How to widen the questions column? | XM Community
Solved

How to widen the questions column?

  • 1 October 2020
  • 7 replies
  • 608 views
R

Hi,
The statements' column is very narrow (first screenshot), when I try to increase it by dragging the column divider to the right, part of the
scale disappears— please see the second screenshot.
It seems that I need to change the stylesheet file. I used the following code but the problem was not resolved.
@media only screen and (min-width: 1200px) {
#Questions{min-width:95%;}
 #SkinContent{min-width:95%;}
}
note. I use % to avoid scaling the width on smart phones.

My question is how can I remove the right/left white spaces and widen the first column' content?
Thank you!

Screen Shot 2020-09-30 at 8.00.33 PM.png

Screen Shot 2020-09-30 at 8.00.11 PM.png

icon

Best answer by TomG 1 October 2020, 16:25

View original

7 replies

rondev
Rank
Userlevel 7
Badge +22

Use the below code in the onReady function of the matrix question (change the % as required)
jQuery(".SkinInner").css("width","65%");

Ron Dev (DM for any request. Freelancer, surveysolution.in)
R

Thank you! But it does not work.
Why the content sticks in the middle? I want to expand the area to see other items of 7 point Likert scale.

TomG
Rank
Userlevel 7
Badge +27

Modify your CSS media rule to this:
@media only screen and (min-width: 1200px) {
.Skin .SkinInner{width:1200px;max-width:95%}
#Questions{min-width:95%;}
  #SkinContent{min-width:95%;}
}

R

it works! Thank you.

K
Badge +1

Hi TomG I used your above advice (October 2020, modify CSS media) for the same kind of problem (survey was way too narrow, all centered with a lot of blank white space on both left and right). Your code advice above solved a huge part of my problem too (thanks!), but while now I have no blank white space to the left of all my matrix tables (I have over 300!), I do have a lot of open blank white space on the right side of the screen. The scale point statements in my columns are text wrapping several lines down. Any additional feedback aside? The idea of needing to manually adjust every column x 300+ questions seems time consuming. Thanks!

A
Rank
Userlevel 7
Badge +21

Add this line to your question JS:

this.getChoiceContainer().querySelector("tr").children[0].style.width = "10%"

TomG
Rank
Userlevel 7
Badge +27

https://www.qualtrics.com/community/discussion/comment/33423#Comment_33423There is probably a CSS rule constraining your Matrix to a fixed maximum width. Use the Inspect feature of your browser to find it, then add a rule to your Look & Feel to override it making the maximum width 100%.

Leave a Reply


Terms & Conditions