How do I reduce the border width for one page in the survey? | XM Community
Skip to main content

I am trying to create an information page (text questions only) like this:
{question text 1 - always show}
{question text 2 - hidden for certain respondents}
{question text 3 - always show}
without any spacing between the "questions". I have tried code from the community (TomG) that reduces the separator spacing... inspecting the preview shows the separator is a line. There are, however, borders around each element and I think reducing the border width (preferably top and bottom only)
qualtrics.pngI have managed to color the border to show where it is by adding:

to the html code of the first "question".
I would also like to reduce the spacing of the border (border-width?) so that there is no space between lines.
My preference would be to use javascript or edit the style as above (not apply a custom css to the whole survey.
Can anyone point me in the right direction?

Did you have a logic for those display questions?

Thanks grahulp5 for having a look at my question. Yes, there would be display logic applied to the middle "question" to hide for some respondents. The first and last would be displayed for all respondents. Essentially I'm looking to make an information page (text only) with some parts hidden, but splitting the text in that way means there is added space between the "questions".

Hi Crystal250 ,
I think below code can serve your purpose.

You can change padding and line-height as per requirement.
With Above code I get this:
image.pngHope it resolves your problem😊!!!

Thanks qualtrics_nerd 🙂 I am feeling a bit dense... where do I put the code? It looks like html... I tried switching the text of question 1 to HTML view and adding your code at the beginning (see image).
qualtrics.pngWhen I inspect the result it shows me the spacing is in div.QuestionBody (see image 2).
qualtrics 2.png

Hi Crystal250 ,
Follow the steps below:
1.Click on Rich Content editor
image.png2.Click on below highlighted symbol:
image.png3.Add your code below:
image.pngFurther, if it is possible can you please share a preview link using dummy survey having similar structure so that I can provide custom code to suit your survey .

Hi qualtrics_nerd,
Your request that I share a link was very helpful. I created a brand new survey (the one I was working in was copied from one from last year). That one works fine:
Preview - Qualtrics Survey | Qualtrics Experience ManagementI then created one copied from the one that's not "working":
https://bcmcf.yul1.qualtrics.com/jfe/preview/previewId/68211e20-fa08-4e0f-9c04-d75514ddd260/SV_cCLnbM7lnUSfIGO?Q_CHL=preview&Q_SurveyVersionID=current
I guess this means there's some style applied that is "interfering" with what I'm trying to do?
I will continue to look into it as well - thank you for all of your help so far!

Switching from flat to classic layout "fixes" it...

Leave a Reply


Terms & Conditions