Need survey smileys aligned in single line with image scale type

[Yogesh35]

Hello All,    I have created survey with image scale for 9 smileys and questions. But when I tried to preview survey, user view not seems to be good. All smileys are placed in large distance and smileys after 6 placed on next line. I have tried to resize it with CSS, but no success. Is there any way to put all smileys on single line? If yes it will be good if anyone provide steps or procedure to resolve this. Attachment provided.

[Abhishek_Chavan]

Hello Yogesh,

Can you share the code that you have written to align the smiley's ? From what I can see is that - they are treated as individual objects and are thus moving to the next line. If you want to force them into a single line I would create a class where all the smileys are treated as a single object and try to position them as per requirement.

[Yogesh35]

I have not written any code for this. I created survey in survey designer and used type as image scale on frontend. But not sure where to make changes in code. Please let me know from where I can get code for this survey so that I can share.

[gloriarorke]

Try creating a Survey > Template. Mark 'allow image', and then add your template definitions. When using templates, answer options appear in order from least to greatest Value.  If you're using the mobile app, the default image is the first (lowest value). So  if you want a happy face to display first, you may want to order your unhappy selection to the highest value.

Afterward, update your metric (question) to the new template. I'm only using 5 images, but they all display on the same line. Update your Scale Definition to Low if you set your template to have the lowest value assigned to your most desired answer.  Hope this helps someone. 

 

[Renin1]

Can we resize the smiley image from big to small?