Looking for custom JavaScript for one question not following style sheet CSS | XM Community
Skip to main content

This is the CSS code I have on the Style Sheet to make all questions where N/A is an option, light gray

 

/*Makes the N/A column light gray on desktop*/
.last {
    background-color: rgba(0,0,0,0.05);
}

 

However, I have one question multiple choice question that contains an N/A option but it is not presenting the light gray background as expected.

 

Any thoughts on what Java code I need to add to the question itself?

We can use below CSS in question’s HTML view to make a multi choice question’s last option background color different:

<style>
.ChoiceStructure li:last-child .SingleAnswer {
background: red;
}
</style>

 


Hi there!  Thank you for this.  It’s still not working.

Below is the HTML code for this question of which has a scoring of  1 thru 5 with labels above 1 & 5 of Poor/ Excellent… and only the gray background should be at the N/A option. Like the below image.

 

 

 

Here is the HTML code for the question I have currently:

 

Please rate the pizza during your most recent visit.
<div>&nbsp;
<div>
<table style="width:100%;" class="TableLabels" cellspacing="1" cellpadding="1" border="0">
    <tbody>
        <tr>
            <td style="text-align: left; width: 50%;">Poor</td>
            <td style="text-align: right; width: 50%;">Excellent</td>
        </tr>
        <style>
    .ChoiceStructure li:last-child .SingleAnswer {
        background: red;
    }
    </style>
    </tbody>
</table>
</div>


Assuming Alignment is horizontal and label position is Vertical for the question, use below CSS:

<style>
.ChoiceStructure tbody tr:first-child td.LabelContatiner:last-child .SingleAnswer {
background: red;
}
</style>

 


Better! I’m also trying get the very light gray box behind the N/A box.  Any thoughts on how that can be achieved.  Do I need to add something to my main CSS style sheet and link it to a class?

 

 


Leave a Reply