Formatting Multiple Likert Questions | XM Community
Solved

Formatting Multiple Likert Questions

  • 1 October 2018
  • 8 replies
  • 33 views

Badge
Hello there! I noticed that if you have Stats IQ, the Cluster Analysis or other features does NOT work with Matrix questions currently.
As a workaround, I layered many Multiple Choice, Single Answer questions on top of each other so that I could show a bunch of questions together.

Does anyone know a way to make it so that the statement shows on the side of the question, rather than on the top? Maybe using Div Class?
icon

Best answer by dsweeney 4 October 2018, 13:22

View original

8 replies

Userlevel 2
Badge +5
You could try adding some custom css in the Look & Feel -> Style section. This would apply to all questions:
```
.Skin fieldset legend
{
float: left;
width: auto;
}
.QuestionBody
{
margin-left: 200px;
}
```
It might need some adjustment for the mobile display.
Badge
Thanks @dsweeney that gets me a little bit closer to my answer but I only need it on a single page, and it was cut off a bit in the frame.

So far I played with the code you provided and added the below but the question body area bleeded off the page.

`.Skin .SkinInner { width: 100%; max-width: 1600px; margin: auto }`
Userlevel 2
Badge +5
Can you provide a screenshot of what you've got so far?
Badge
Sure thanks for helping me. It seems to be working better when I repasted it, but is there a way to fix the width of the likert scale points so that each area doesn't change?

!
Badge
.Skin .SkinInner { width: 100%; max-width: 1600px; margin: auto }
.Skin fieldset legend
{
float: left;
width: auto;
}
.QuestionBody
{
margin-left: 200px;
}
Badge
One other thing I forgot to note is that if I play around with the width of the fieldset legend, it also changes the width of the Text header above.

!
Userlevel 2
Badge +5
Thanks. Assuming your instructions are in a decorative block (Text/Graphic), how does the following work? I've reduced the max-width to avoid the bleeding and set the question text to be 400px wide. The DB rule resets the CSS values for those legend elements.

```
.Skin .SkinInner {
width: 100%;
max-width: 1200px;
margin: auto;
}
.Skin fieldset legend
{
float: left;
width: 400px;
white-space: normal;
}
.Skin .DB fieldset legend
{
float: inherit;
width: inherit;
white-space: inherit;
}
.QuestionBody
{
margin-left: 200px;
}
```
Badge
That works, thank you!
!

Leave a Reply