- Posts: 17
- Thank you received: 0
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Position of the "equals sum" display
- equilibrium_21
-
Topic Author
- Offline
- New Member
-
1 year 1 week ago #242379
by equilibrium_21
Position of the "equals sum" display was created by equilibrium_21
Please help us help you and fill where relevant:
Your LimeSurvey version: 5.6.14
Own server or LimeSurvey hosting: Own
Survey theme/template: fruity
==================
In my survey, I use the multiple numerical input question quite a lot with the "equals sum"-validation. As can be seen in the screenshot, I made the input boxes narrower. However, the "remaining" and "total" values are still in the center and the suffix is displayed at the left corner, which altogether looks quite odd. Does anyone know how to change this? Thanks in advance
Your LimeSurvey version: 5.6.14
Own server or LimeSurvey hosting: Own
Survey theme/template: fruity
==================
In my survey, I use the multiple numerical input question quite a lot with the "equals sum"-validation. As can be seen in the screenshot, I made the input boxes narrower. However, the "remaining" and "total" values are still in the center and the suffix is displayed at the left corner, which altogether looks quite odd. Does anyone know how to change this? Thanks in advance
Attachments:
Please Log in to join the conversation.
- Joffm
-
- Offline
- LimeSurvey Community Team
-
- tpartner
-
- Offline
- LimeSurvey Community Team
-
1 year 1 week ago #242388
by tpartner
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Position of the "equals sum" display
Insert some CSS like this in the question source (adjust the max-width rules to match your input widths):
Desktop:
Mobile:
Sample survey attached:
If you have many question with the same layout, you can place the CSS in your theme custom.css file:
Code:
<style type="text/css" data-author="Tony Partner"> @media (min-width: 760px) { #question{QID} .ls-group-dynamic .ls-input-group > div { float: left; width: 100%; max-width: 130px } } @media (max-width: 760px) { #question{QID} .ls-group-dynamic .control-label { text-align: left; } #question{QID} .ls-group-dynamic > div > div { float: left; width: 100%; max-width: 130px } } </style>
Desktop:
Mobile:
Sample survey attached:
If you have many question with the same layout, you can place the CSS in your theme custom.css file:
Code:
@media (min-width: 760px) { .question-container.numeric-multi .ls-group-dynamic .ls-input-group > div { float: left; width: 100%; max-width: 130px } } @media (max-width: 760px) { .question-container.numeric-multi .ls-group-dynamic .control-label { text-align: left; } .question-container.numeric-multi .ls-group-dynamic > div > div { float: left; width: 100%; max-width: 130px } }
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Please Log in to join the conversation.
- DenisChenu
-
- Offline
- LimeSurvey Community Team
-
- equilibrium_21
-
Topic Author
- Offline
- New Member
-