Multiple choice checkbox displays on one line
d-horner opened this issue · comments
Using a large list of multiple select options incorrectly displays choices on one line:
Adding a <br> tag within the for loop in the questions.html template resolves this display issue:
I am guessing it is due to wrapping and some CSS somewhere, but I've not had the chance to look into it quite yet.
Good catch ! Could we use something like this instead ? https://getbootstrap.com/docs/4.0/components/input-group/#checkboxes-and-radios. Or maybe django boostrap form "crispy" {{ form|crispy }}. I'll let you choose the solution between those 2 or a simple <br> as we already have boostrap and django-boostrap-form as dependencies.
I was actually going to suggest creating a boostrap4 branch as the current repo makes use of bootstrap3 (I did a quick once over and there were only one or two CSS selectors that should/would need updating).
I would propose going a step further and creating a more accessible stylesheet than the current implementation. The grey backdrop doesn't meet the contrast ratio required for WCAG 3 accessibility guidelines - I know this is a minor suggestion, possibly due to use case (patient research)/HIPAA compliance background, but it can't hurt?
If this is something that you would be interested in pursuing I would happily contribute to this end!
Sure thing, let's do this in another pull request than polish translation, so I can merge polish and <br> first then ;)
I created #109.