- Posts: 10109
- Thank you received: 3595
Welcome to the LimeSurvey Community Forum
Ask the community, share ideas, and connect with other LimeSurvey users!
Fix two answers at last in multiple choice question showed with columns
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
2 months 2 weeks ago - 2 months 2 weeks ago #255965
by tpartner
Since this is intended to resemble a table, I was thinking along the lines of a single <ul> (no core "columns") with display:grid and various grid-template-columns properties.
...but, still away from a computer...
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Replied by tpartner on topic Fix two answers at last in multiple choice question showed with columns
Is the column-count property intended for separate elements (<li> elements)?Maybe check with this solution : github.com/LimeSurvey/LimeSurvey/pull/3038
(i mean : adding a new class and deactivate the core solution)
Since this is intended to resemble a table, I was thinking along the lines of a single <ul> (no core "columns") with display:grid and various grid-template-columns properties.
...but, still away from a computer...
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 2 months 2 weeks ago by tpartner.
The following user(s) said Thank You: Oterito
Please Log in to join the conversation.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13648
- Thank you received: 2491
2 months 2 weeks ago #255999
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic Fix two answers at last in multiple choice question showed with columns
The core column-count is to set the number of column
But a SurveyTheme can easily create some display-column-2,display-column-3,display-column-4,display-column-5 … css class (good idea !)
display:grid can be very interesting too : since we can have 2 solutions
One showing answers like that (2 columns)
css : column-count:2
A C
B D
css : grid-template-columns: 1fr 1fr;
A B
C D
See old mantis issue : bugs.limesurvey.org/view.php?id=7927
But a SurveyTheme can easily create some display-column-2,display-column-3,display-column-4,display-column-5 … css class (good idea !)
display:grid can be very interesting too : since we can have 2 solutions
One showing answers like that (2 columns)
css : column-count:2
A C
B D
css : grid-template-columns: 1fr 1fr;
A B
C D
See old mantis issue : bugs.limesurvey.org/view.php?id=7927
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The following user(s) said Thank You: Oterito
Please Log in to join the conversation.
- tpartner
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 10109
- Thank you received: 3595
2 months 2 weeks ago - 2 months 2 weeks ago #256025
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 Fix two answers at last in multiple choice question showed with columns
Yes, one limitation of the display:grid approach is that the items will be arranged sequentially horizontally.
But, if randomized, that does not matter.
If you would like to implicitly define 4 columns on larger screens (2 on smaller screens) and hide the irrelevant items, you can disable the core columns feature and add this CSS to the question source.
Sample survey attached:
[/i]
But, if randomized, that does not matter.
If you would like to implicitly define 4 columns on larger screens (2 on smaller screens) and hide the irrelevant items, you can disable the core columns feature and add this CSS to the question source.
Code:
<style type="text/css" data-author="Tony Partner"> #question{QID} .ls-answers ul { display: grid; grid-template-columns: repeat(4, 1fr); grid-gap: 0 1rem; } @media (max-width: 768px) { #question{QID} .ls-answers ul { grid-template-columns: repeat(2, 1fr); grid-gap: 0 0.5rem; } #question{QID} .form-group { margin-bottom: 0; } } </style>
Sample survey attached:
[/i]
Cheers,
Tony Partner
Solutions, code and workarounds presented in these forums are given without any warranty, implied or otherwise.
Last edit: 2 months 2 weeks ago by tpartner.
The following user(s) said Thank You: DenisChenu, Oterito
Please Log in to join the conversation.
- DenisChenu
- Offline
- LimeSurvey Community Team
Less
More
- Posts: 13648
- Thank you received: 2491
2 months 1 week ago #256042
by DenisChenu
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
Replied by DenisChenu on topic Fix two answers at last in multiple choice question showed with columns
> Yes, one limitation of the display:grid approach is that the items will be arranged sequentially horizontally.
It's not a limitation : both can be OK
Thanks for this style : i think i add both in next SkelVanilla release (but lot of work )
It's not a limitation : both can be OK
Thanks for this style : i think i add both in next SkelVanilla release (but lot of work )
Assistance on LimeSurvey forum and LimeSurvey core development are on my free time.
I'm not a LimeSurvey GmbH member, professional service on demand , plugin development .
I don't answer to private message.
The following user(s) said Thank You: Oterito
Please Log in to join the conversation.
- Oterito
- Topic Author
- Offline
- New Member
Less
More
- Posts: 19
- Thank you received: 0
2 months 1 week ago #256092
by Oterito
Replied by Oterito on topic Fix two answers at last in multiple choice question showed with columns
Thanks very much! It worked perfectly. In fact the items arranged sequentially horizontally also solved another new request that the two option fixed at the end were showed in last row.
Thank you again!
Thank you again!
Please Log in to join the conversation.