How can I increase the width of my survey for desktop without affecting the optimized mobile view? | XM Community
Solved

How can I increase the width of my survey for desktop without affecting the optimized mobile view?

  • 4 December 2018
  • 5 replies
  • 1031 views

Hi, I'm trying to increase the width of my survey. I'm using this:

.Skin .SkinInner {min-width: 1000px!important;}

However, this messes up the optimization for mobile view. How can I put in a separate CSS code just for the desktop view?
icon

Best answer by Kennedy_I 4 December 2018, 10:03

View original

5 replies

Userlevel 1
Badge +9
Try adding the below syntax:

@media screen and (min-width: 800px) {
}

This will keep the width of your mobile resolution regardless if you adjust the desktop width.
Awesome! That worked nicely, thanks 🙂 For those who are curious, the CSS codes are as follows:

.Skin .SkinInner {
width:1100px;
}

@media screen and (min-width: 600px) {
}
Badge +1
Hi there.

I am new to all of this and am affected by the same problem. Can you tell me where to put that code for it to keep my survey nice and wide on desktops? Actually, I don't care about mobile at all (but its nice to have look nice on there as well it if it works)
Hi @LukasL,

Here are the steps to put in the code:

Look & Feel > Style > Custom CSS
!
!
Userlevel 2
Badge +15

Hi all - I'm also trying to widen the survey area so matrix questions appear less squashed. I've applied the following but it reduces the width of the page by half and does nothing to the survey area itself. What can I change to the below to widen the survey/question area without changing the background area?

.Skin .SkinInner {
width:1100px;
}
@media screen and (min-width: 600px) {
}

Leave a Reply