JSFiddle - React, Tailwind, and code Playground

by avrelian

HTML

<table>
    <tr class="q1">                       
        <td><a class="question" href="#">What is my favorite language?</a></td>
        <td>
            <input class="radiostyle wrong" type="radio" name="answers" value="Java" id="answers_1_Java" />
            <label for="answers_1_Java">Java</label></td>
        <td>
            <input class="radiostyle right" type="radio" name="answers" value="JavaScript" id="answers_1_JavaScript" />
            <label for="answers_1_JavaScript">JavaScript</label></td>
        <td>
            <input class="radiostyle wrong" type="radio" name="answers" value="Ruby" id="answers_1_Ruby" />
            <label for="answers_1_Ruby">Ruby</label></td>
        <td>
            <input class="radiostyle wrong" type="radio" name="answers" value="C#" id="answers_1_C#" />
            <label for="answers_1_C#">C#</label></td>
        <td></td></tr></table>

CSS

td {
    padding: 5px;
}

input {
    margin-right: 3px;
}

input.right:checked + label {
    color: green;
}

input.wrong:checked + label {
    color: red;
}