Hi Gordon and others,
Is there any trick to getting the answer choices in more than one column? I want to project a question and have the choices fit into one screen's worth of space.
Thanks,
Jeff
Hi Jeff,
you could probably do it with CSS, added to your HotPot via the JQuiz (on your PC/laptop) options to configure output, or config file that you add to a TaskChain task.
regards
Gordon
Hi Gordon,
Yeah, first I wanted to know if there were any quick and dirty tricks to do this. At first I thought this would be a little arduous, but turned out fairly simple. Some css searching got me to find this.
ol {
columns: 2;
-webkit-columns: 2;
-moz-columns: 2;
}
which did the trick if I inserted into the css section of the generated html page.
When I put it into the Custom tab in the configuration file along with the keypad options I already had, that worked too.
<style type="text/css">
div#CharacterKeypad button, input.ShortAnswerBox, textarea.ShortAnswerBox {
font-family: "Lucida Sans Unicode";
}
ol {
columns: 2;
-webkit-columns: 2;
-moz-columns: 2;
}
</style>
Thanks,
Jeff
Hi,
Thank you for sharing this useful piece of code.
Is there any way to define where the first column should stop?
For instance, in your example, would it be possible to specify that the segment "chart that best represents this change is ..." should be part of the first column?
Many thanks,
Susanna
Perhaps you could use the "break-before" CSS property. For example:
<div style="break-before: column;">top of next column</div>
... though you may find that browser support is inconsistent
Dear Gordon,
Sorry I didn't thank you for this earlier, but it took me a while to understand that I shouldn't include 'top of next column'!!
It works fine but, you're right, not in all browsers.
Thank you for your help.
Susanna