Solved
Inline email question
+1Hi all,
Do you know how to modify the inline email question, so when viewed on mobile, the choices are adjusted automatically, similar to how it happens in the actual survey?
I'm looking to embed a question with five option choices (very satisfied - very dissatisfied) into email body. While the position of these choices adjusts automatically from horizontal to vertical in the actual survey when viewing on mobile, all five choices for embedded question are arranged horizontally and are wrapped mid-word which has an impact on overall look and feel.
My understanding is that this could be resolved using custom coding - have you done anything similar? What would be a good starting point? We do not want to modify the question itself.
Thanks,
Natalya
Best answer by TomG
@NatalyaG,
The issue you face is that email clients (e.g. MS Outlook) are 'dumb' when it comes to displaying html. They don't understand advanced CSS. So it is difficult to impossible to do any type of advanced device responsive html design. I think that is why Qualtrics chose to use tables for embedded questions. You have to design based on the lowest common denominator.
+27Natalya,
When you insert an inline question into your email invite, it adds an html table to your invite message with a nested table for the choices. You can click on Source and edit the table layout. This won't effect the question in the survey.
For your specific case, it sounds like you just want to make all the choices vertical in the email. To to that you just need to make each choice a row in the nested html table. So for each of your choices add a `<tr>` in front of the `<td>` that contains a choice and a `</tr>` after the `</td>` at the end of the choice (there will already be a `<tr>` before the first choice and a `</tr>` after the last choice so you won't need to add those).
+1Hi @TomG ,
Thank you for a suggestion!
I think this suggestion could be a workaround in this case. What we wanted to do is to keep the original horizontal alignment in the desktop version and have it changed when viewed on mobile, similar to how survey questions behave, so customer experience is the same when they click on the question and are redirected to the actual survey.
However, if choosing between vertical alignment in the desktop version and a 'condensed' mobile view, I think I could actually try to change the alignment (and, hopefully, the auto-align feature for mobile view could be added in the future! :)
Have a great weekend,
Natalya
+27@NatalyaG,
The issue you face is that email clients (e.g. MS Outlook) are 'dumb' when it comes to displaying html. They don't understand advanced CSS. So it is difficult to impossible to do any type of advanced device responsive html design. I think that is why Qualtrics chose to use tables for embedded questions. You have to design based on the lowest common denominator.
Hi there,
Following up on this question to see if anyone has found any workarounds for a scaled question with a horizontal alignment. The text still wraps awkwardly in the last button (even when it's just the number 10).
This question does not display properly on the iPhone Mail app. Not looking to do anything fancy or responsive, just wondered if anyone has found a 'global' fix to stop the wrapping.
Best,
Christie
Enter your E-mail address. We'll send you an e-mail with instructions to reset your password.