How to resize background for desktop and mobile? | XM Community
Skip to main content

Hi Qualtrics community
I'm struggling to resize the background for my Qualtrics survey. This is what I have:
[for desktop]:
image.png[for mobile]:
image.pngI want to have the full Company Logo as watermark in the back, but it showed up extremely fuzzy and cropped in both desktop and mobile.

My CSS script is here:
image.pngI have no experience with CSS script before, how can I resize Company Logo to fit the screen for both desktop and mobile users?

Many thanks!

Hey sophietwu ,
One of the key parts for a background image is using a large size, high resolution and quality image. To start, just consider proportion of a small/medium image to be stretched for desktop use and it likely won't be clear.
Consider asking your design team for a new logo image that would also look clear and be appropriate for use as a desktop background.
What I've found to work the best is asking my MarComm team to design a desktop quality image to use as a survey background. It won't always align perfectly with mobile but centering the logo or most important part can help.
An example. This is a repurposed desktop image our staff uses as a video call background which also fits well with the theme for a survey we send for construction clients.
Background.PNG

https://community.qualtrics.com/XMcommunity/discussion/comment/44730#Comment_44730Many thanks, that seems to resolve our issue! :D

Leave a Reply


Terms & Conditions