Hi there,

i´m using a seven point scale on an array question (stimme überhaupt nicht zu, stimme eher nicht zu, teils/teils, stimme eher zu, stimme voll zu, weiß nicht, keine Angabe).

I want to add a visual separator to separate the last to answers (weiß nicht, keine Angabe).
It should look like this one: www.limesurvey.org/de/foren/can-i-do-thi...or-an-array-question
But i would prefer a solution without javascript.

In version 2.05 of limesuvey i solved it by adding this to template.css:
.answer_cell_006 {
border-left: 2px solid #000000;
}

Since i upgraded to version 2.55.2 of LS (hosted by Limeservice) this does not work anymore. I´m using a slighty modified version of the default-template.

Thank you very much for helping,
Frank

Why don't you want to use Javascript?
It is with pure css a quite challenging part since the new templates are responsive. So while you need on a deskop pc a left border you need on a tablet or mobile a top bar.

And the items you have to style don't have ID's so selecting them with pure css is also more tricky.
With JS it is a little bit more simpler because you can check the window width and select the DIV's more easy.

You need to style the penultimate div of the div with the class answers-list and his first child div with class row:
That would achieve you something like in attachment 1 but when it is viewed on a mobile it breaks (see attachment 2)

Of course you style it with CSS and nth-child selectors or so but then it would be used on every list AND you would have to use media queries

I think, perhaps, the rule for the border style is being overridden by a more specific style.

Try something like this which should also take care of the responsive aspect:

Hello urbana and tpartner,

thanks for your suggestions. Unfortunately they both do not work.
tpartner, I tried your javascript solution from this thread: www.limesurvey.org/de/foren/can-i-do-thi...or-an-array-question
Now i got the same graphical problems as in the other thread (see screenshot 1). Furthermore, the border should only appear on matrix questions that use my mentioned own-defined scale, not on other question types (see screenshot 2 where the border should not appear).
Could you please check this demo here?

Thanks for helping!
Frank

Strange, the URL has been replaced. Here´s the correct one .

thanks for your suggestions. Unfortunately they both do not work.

The CSS solution works for me in all browsers. I suspect your problem was caching.

Furthermore, the border should only appear on matrix questions that use my mentioned own-defined scale, not on other question types (see screenshot 2 where the border should not appear).

You seem to have inserted the script after the help section of all questions. It is supposed to be placed in the question source, not in question.pstpl.

Now i got the same graphical problems as in the other thread (see screenshot 1).

That is a VERY old workaround. Try this updated script:

Hello Tony,

thank you very much for your help! Your new script works as code placed to a question itself.
One thing: When resizeing the browser window (FF Desktop), the small separator becomes a very thick horizontal one (see screenshot). How can this be corrected?

Thanks!
Frank

Try something like this at the end of template.css:

Oops, got the wrong media query - use this instead: