Is there a way to insert a vertical divider in a question?

Hello @kasiao , Add following line in javascript of that question: document.getElementsByClassName("ChoiceStructure")[0].setAttribute("rules","cols");

> @akshay11 said: > Hello @kasiao , > > Add following line in javascript of that question: > > document.getElementsByClassName("ChoiceStructure")[0].setAttribute("rules","cols"); Thanks. It doesn't do anything. Should I configure some value?

> @TomG said: > Yes, use this script. Thanks, it does work for the desktop version, but not for mobile. Do you have a version that would work for mobile, where the line needs to be horizontal (or alternatively no line at all in mobile version).

> @kasiao said: > > @TomG said: > > Yes, use this script. > > Thanks, it does work for the desktop version, but not for mobile. Do you have a version that would work for mobile, where the line needs to be horizontal (or alternatively no line at all in mobile version). @kasiao - The script does no line at all for a mobile matrix (aka accordian).

@TomG It adds the vertical line too, just on the side (the bottom line is a separator between questions that Qualtrics adds). !

@kasiao - I just updated the script...try it again.

@TomG, works, thank you!

@TomG Thanks so much for this code, super helpful! Any chance you know what the update would be if I wanted a vertical line for the second to last most column? For example, Not useful Somewhat useful Very useful Extremely Useful | Don't know Not relevant to me

> @jli5184 said: > @TomG Thanks so much for this code, super helpful! Any chance you know what the update would be if I wanted a vertical line for the second to last most column? For example, > > Not useful Somewhat useful Very useful Extremely Useful | Don't know Not relevant to me Change .last to the appropriate .cX class.

@TomG hm how do I locate .cX class? If there's 6 choices and I want to put the line before the 5th choice, is it something like .cX5? Sorry I'm not familiar with Javascript!

Use your browser's inspect feature. The first answer column is c4, so I think you want to use .c8

.c8 worked, thank you!!

@TomG Is there any chance a vertical line can be added to horizontal multiple choice questions in a similar way?

@TomG Never mind, found your solution here! Thanks so much for your help https://www.qualtrics.com/community/discussion/6000/how-to-add-a-vertical-line-before-last-column-in-a-multiple-choice-question-with-horizontal-layout

@TomG or actually that adds a line to all multiple choice questions. Do you know how I could amend so it only applies to one question? <style> @media only screen and (min-width:481px) { td:last-of-type { border-left: 1px solid grey; } td:last-of-type label { margin-left:10px; } } </style>

> @jli5184 said: > @TomG or actually that adds a line to all multiple choice questions. Do you know how I could amend so it only applies to one question? > > <style> > @media only screen and (min-width:481px) { > td:last-of-type { border-left: 1px solid grey; } > td:last-of-type label { margin-left:10px; } > } > </style> Add it to the question text in a `<style>` tag instead of to Look & Feel. It will apply only to the page.

@TomG By question text, do you mean adding it to the html view? When I add the below to the html view it still adds a line for all the questions. <style> @media only screen and (min-width:481px) { td:last-of-type { border-left: 1px solid grey; } td:last-of-type label { margin-left:10px; } } </style>

> @jli5184 said: > @TomG By question text, do you mean adding it to the html view? When I add the below to the html view it still adds a line for all the questions. Did you remove it from Look & Feel?

@TomG I didn't put it in Look & Feel, I only put it in the HTML View of the question I wanted (checked if it was in Look & Feel and it wasn't). Is there somewhere else it should be going?

> @jli5184 said: > @TomG I didn't put it in Look & Feel, I only put it in the HTML View of the question I wanted (checked if it was in Look & Feel and it wasn't). Is there somewhere else it should be going? It will apply to all questions on that page. You can put the question on a page by itself, or you can add the qid to the css selectors.

@TomG Do you mind providing an example of how I'd add the qid to the css selectors? Is there code I'd have to add in the Javascript option? Thanks so much again for all your help, really appreciate it

> @jli5184 said: > @TomG Do you mind providing an example of how I'd add the qid to the css selectors? Is there code I'd have to add in the Javascript option? Thanks so much again for all your help, really appreciate it ``` #QID1 td:last-of-type { ... ```

@TomG That worked beautifully, thank you!!

@TomG Is there any way to get this code to also apply to Mobile when it automatically changes options to vertical? Not sure if there's a way to add a line above the DK button or potentially separate in some other way but on Mobile there is no line.