Use Case 5. Other and Comment fields customization
Issue
This use case demonstrates how you can change width of the 'Other' field in questions of the Pick One (Radio Buttons) type and 'Comment' field in question of thePick One with Comment type.
Example is shown on the pictures below:
![](../../__attachments/51085318/image2021-8-6_11-39-31.png?inst-v=782736d0-8879-4791-b558-515790c9ddd1)
Solution
On the survey Edit Layout>CSS page add one of the following pieces of code to improve question appearance:
To customize width of the Other field in the Pick One or Other type of question:
.aDivQuestion_Qxxx .inputPickOneOther {width:Ypx !important}
OR.aDivQuestion_Qxxx .inputPickOneOther {width:Ypx !important}
To customize width of the Comment field in the Pick One with Comment type of question
.aDivQId_questionIdentifier .inputPickOneComment {width:Ypx !important}
OR.aDivQId_questionIdentifier .inputPickOneComment {width:Ypx !important}
.aDivQuestion_Q and .aDivQId_ | reference to survey question; |
---|---|
xxx | question sequence number; |
questionIdentifier | question custom identifier; |
.inputPickOneOther - | 'Other' field |
.inputPickOneComment - | 'Comment' field |
width:Ypx - | change Y to increase or decrease field width in pixels |
!important - | means that the text alignment of this particular item has an advantage over other text alignments indicated in other classes. |
Result
As a result, given questions will look as follows:
![](../../__attachments/51085318/image2021-8-6_11-43-20.png?inst-v=782736d0-8879-4791-b558-515790c9ddd1)