Ensure Matrix Question is Displayed to the full width of the window | XM Community
Skip to main content
Hi All, I have a matrix question that has 9 response options (it's an established scale, so I don't want to monkey with this). When I try to display it, even if the window is sized large enough, the matrix question gets clipped and requires the use of a horizontal scroll bar to see the last several options: ! Is there some CSS (or something else) that I can use to make this question (only) use the full width of the window? Thanks!
I am also looking for an answer to this.
I am looking for an answer as well!
We had a matrix that was doing this. Adding this to the html fixed it. We figured it was the padding added from our theme. IDK if it will be helpful to anyone else. <style> .Skin .QuestionOuter.Matrix{ max-width: 100%; } </style>

I have the same issue.

We solved this by dragging the dividing line (between the questions and the response options) further left. This forces the questions to word wrap in a shorter space and gives more room for the response options.

I changed the font size of the scale points (moving the divider works and changing the font size of the statements too) until it fit with scrolling.

I am also looking for a solution for this issue. I made the text smaller and that helped a little bit, but it wasn't quite enough

You can use the code provided by LibertyW : .Skin .QuestionOuter.Matrix{ max-width: 100%; }
For using it, use the "Custom CSS" option in the Look & Feel section --> Style

https://community.qualtrics.com/XMcommunity/discussion/comment/41374#Comment_41374The code does not work for me, do I need to change something else?

https://community.qualtrics.com/XMcommunity/discussion/comment/43677#Comment_43677I'm experiencing the same issue. This code looks helpful but does not work in my case to widen/increase the viewability of the matrix table and eliminate horizontal scrolling.

Found a solution! 

To increase the width of your matrix table so that it employs more of the actual screen space, go to look and feel → Style → Custom CSS

Then copy-paste the code at the end of this message.
I’ve simply added “!important” to the code provided by LibertyW a few years ago. Seems to work nicely in my survey. 
-----------------------------------------------------------

.Skin .QuestionOuter.Matrix {
    max-width: 100% !important;
}


 

@Jlad Thank you this works for me

.Skin .QuestionOuter.Matrix {
    max-width: 100% !important;
}

Terms & ConditionsAccessibility statement