How to center-align a Hot Spot question | XM Community
Skip to main content
Solved

How to center-align a Hot Spot question

  • July 29, 2022
  • 1 reply
  • 121 views
W

Hello all,
I have tried several solutions found online to do this, but nothing so far has worked. Is there a way to center-align Hot Spot questions while retaining the placement of the hot spot regions? I know this might be a long shot, but I am very eager to figure out if it is possible. Thus far, I have tried:
Qualtrics.SurveyEngine.addOnReady(function () {
    document.querySelector(".QuestionBody").style.display = "flex";
});
Which seemed to get some praise here (https://community.qualtrics.com/XMcommunity/discussion/13446/is-it-possible-to-center-align-the-graphic-in-a-hot-spot-question), but I cannot find success using it.
Along with other HTML solutions which likely didn't work simply because hot spot questions do not appear in the Rich Content Editor box.
Thank you so much for any assistance, I very much appreciate it.

Best answer by Tom_1842

Hi there, I was able to center the Hot Spot image using the JavaScript described in that thread, but I think I lean towards the CSS solution provided towards the bottom of the thread. Try adding the below to the Custom CSS portion in the Style section of the survey's Look & Feel:
.Skin .HotSpot .QuestionBody{
display: flex;
justify-content: center;
}

1 reply

Tom_1842
Level 8 ●●●●●●●●
Forum|alt.badge.img+28
  • Tom_1842
  • Level 8 ●●●●●●●●
  • Answer
  • August 1, 2022

Hi there, I was able to center the Hot Spot image using the JavaScript described in that thread, but I think I lean towards the CSS solution provided towards the bottom of the thread. Try adding the below to the Custom CSS portion in the Style section of the survey's Look & Feel:
.Skin .HotSpot .QuestionBody{
display: flex;
justify-content: center;
}

W
Terms & ConditionsAccessibility statement