I'm trying to make the background of a button change color, depending on the property of it's neighboring checkbox. But since I'm dependent on the HTML rendered by the questionnaire software I use, I'm unable to change the markup.
Let me show you what I mean:
![This the first situation: everything is OK here [1]http://ift.tt/1wDZyex
Upon clicking 1 of the 8 options, it get's highlighted. But once you click on the "next" button below, and then on the "back"button in the following screen you will encouter the following...
![D'oh!][2]http://ift.tt/1zzzHir
Here the option is still selected, but the button is no longer highlighted. This is a problem, as I want to hide the checkboxes later on.
I want to solve this problem using CSS only. However the checkbox and buttons are automatically placed inside a table. The table uses the following structure:
<table>
<tr>
<td class="checkbox">
<input type="checkbox">
</td>
<td class="item">
<span class="Option">
<a href="">Answer</a>
</span>
</td>
</tr>
</table>
I've tried using:
input[type=checkbox]:checked + a{background-color:red;}
This only works when checkbox and answer button are siblings. Hope you can help me with this...
Aucun commentaire:
Enregistrer un commentaire