Free-sort button position

[jaydavies16129]

Hi there. I am having trouble trying to re-position my button in the free-sort plugin. At the moment it is showing at the bottom-centre of the screen below the sort area, but I'd like it to be at the bottom right. I have tried (unsuccessfully) to modify the plug-in, and looked into the button_html but I'm a bit stuck!

Any help would be great :)

[becky-gilbert]

Hi @jaydavies16129, the free-sort 'done' button is inside of a div, and you can move the button to the right by setting that div's text-align CSS property to right. I think the easiest way to do that is to edit this line of the plugin:

jsPsych/plugins/jspsych-free-sort.js

Line 186 in 7b16a1d

html += '<div><button id="jspsych-free-sort-done-btn" class="jspsych-btn" '+

So that the text-align: right; CSS rule is set in the div's in-line style, like this:

    html += '<div style="text-align:right;"><button id="jspsych-free-sort-done-btn" class="jspsych-btn" '+ 

Let us know if that works for you, and if you have any questions.

[jaydavies16129]

Hi @becky-gilbert, for some reason thats not working. I don't know if I need to alter something in the main code as well?

[becky-gilbert]

Weird! I just double-checked this using the free-sort example file from v6.3.1, and it works for me:

Maybe you have a typo somewhere? Feel free to share code and screenshots if you want more help figuring it out.

[jaydavies16129]

Hi @becky-gilbert. Apologies, this was my fault. I accidentally didn't even saved the modified plug-in... that would have helped! Problem solved, thank you so much!

[becky-gilbert]

No problem, glad we figured it out!