Border color for multiple choice for single answer and multiple answers are not changing to black | Experience Community
Skip to main content
Solved

Border color for multiple choice for single answer and multiple answers are not changing to black

  • June 22, 2018
  • 4 replies
  • 278 views
S
! Border color for multiple choice for sing answer and multiple answers are not changing to black on click. Below is the code used for "Minimal 3D - Green" template (attached is the image) .Skin label.MultipleAnswer.q-checked, .Skin label.SingleAnswer.q-checked { border-color: black; } .Skin label.MultipleAnswer:hover, .Skin label.SingleAnswer:active { border-color: black !important; } however on hover it is working : .Skin label.MultipleAnswer:hover, .Skin label.SingleAnswer:hover { border-color: black !important; }

Best answer by LaurenK

Hey @SamK! It looks like you are targeting the correct elements, but need to add an additional property `border-style: solid;` to set the line styling. I would recommend checking out this page about border properties!

4 replies

Rich_Boits_Walker
QPN Level 3 ●●●
Forum|alt.badge.img+7
Hi @SamK I was able to get the following to work from your first example: .Skin label.MultipleAnswer.q-checked, .Skin label.SingleAnswer.q-checked { border-color: black; border-width: 2px; } The border is only a single pixel, so maybe try bumping it up to 1.5px or 2px in width with the purple answer choice background color you're using. I couldn't see it at first without the eye dropper.
    S
    • SamK
    • Author
    • June 25, 2018
    Hi @Rich_Boits_Walker , thanks for the response. I was actually looking for the functionality when the option is clicked, before click it works fine. On click for some reason it doesn't work.
      Rich_Boits_Walker
      QPN Level 3 ●●●
      Forum|alt.badge.img+7
      Hi @SamK, sorry I missed your reply until now. Hmmm... I was able to get it working, but there could certainly be something going on that is different between our setups. If you're willing to post your .qsf file (or a similar example from a copy to protect your project) I can take a look.
        LaurenK
        Former XM Community Team Member
        Forum|alt.badge.img+13
        • LaurenK
        • Former XM Community Team Member
        • Answer
        • July 9, 2018
        Hey @SamK! It looks like you are targeting the correct elements, but need to add an additional property `border-style: solid;` to set the line styling. I would recommend checking out this page about border properties!
          Terms & ConditionsAccessibility statement