Multiple choice labels appear to right of graphic instead of bottom | XM Community
Skip to main content
I have a multiple choice yes / maybe / no question with graphics. Each label is set to appear below / beneath the graphic, but in the actual survey, they're appearing to the right...



Actual survey:

!



Survey editor:

!



I assume this might be due to CSS problems. I checked the survey's theme, and outside of some color and font changes, everything else is default.



How to proceed?
It may depend on how the graphic is being inserted.

If the image is being inserted using the Rich Text Editor, you can code a line break into the question label using the HTML syntax editor.



```

<img src="image.png" style="width: 86px; height: 88px;" /><br />

Yes

```



If you are inserting the image using the drop down next to the question label, you can identify the placement of the label.



!



In the end, you are trying to get your question to look like something similar to this in the survey, correct?



!
Yes; I'm trying to make it look like that. The graphic was added using the second option you mentioned and the labels were all set to "bottom," yet they're still displaying to the right. The CSS for the live survey appears to be using the correct, default class (by default, I mean the general class that's used when the labels are supposed to be below):



.Skin label.MultipleAnswer.LabelPositionBELOW, .Skin label.SingleAnswer.LabelPositionBELOW {

padding-left: 20px!important;

display: flex;

align-items: center;

justify-content: center;

text-align: center;

padding-top: 0;

padding-bottom: 0;

}
Hmm. It would seem one action is overriding another action.

Sorry I am not able to help further here.

Hopefully there is another that can be more helpful.

Last ditch effort, if you are under a time crunch, would be to contact support?



EDIT:

I just tinkered a little more with the html.

Could it help to edit the labels to be the following:



`<div style="text-align: center;">No</div>`



Same code, inserting "Yes" and "Maybe" for "No".



Also, make sure the label position menu on the right side of the question has "Above" selected, instead of "Side."



!
> @C_Bohn said:

> Last ditch effort, if you are under a time crunch, would be to contact support?



Fortunately, this isn't a deal-breaker, especially considering this will be an internal-facing survey.
> @BSweet said:

>

> Fortunately, this isn't a deal-breaker, especially considering this will be an internal-facing survey.



I just edited my last comment after tinkering some more. Take a look to see if that helps.
Ah, thanks.



I confirmed that the "label position" was already set to "above" for all of them. I also manually centered the label via div in the rich content editor for each option, but nothing changed, unfortunately.
A customer support inquiry has been submitted. Curious as to what the remedy will be.

BSweet I wonder if you ever found a solution? Seems to still be a problem; even with label settings specified the text appears on the side.

cbwin_Penn Nope. I don't remember exactly what we did, but I'm pretty sure we switched to a competitor for what was a pretty basic survey.

Turns out I was able to find a solution; it worked if I put in the text and image through the rich content editor.

Leave a Reply


Terms & Conditions