Why is it that when the text is clicked, the radio button is checked, and when the little green patch is clicked, the frame is working, but they both don't work at the same time? Any assistance in resolving this issue would be greatly appreciated.
body {
user-select: none;
}
a {
text-decoration: none;
margin: 10px;
color: #000;
background: violet;
}
label {
background: yellowgreen;
}
input[type="radio"] {
display: none;
}
input[type="radio"]:checked+a>label {
color: red;
}<input type="radio" name="list" id="1" />
<a href="Text1.html" target="frame">
<label for="1">text</label>
</a>
<input type="radio" name="list" id="2" />
<a href="Text2.html" target="frame">
<label for="2">text</label>
</a>
<input type="radio" name="list" id="3" />
<a href="Text3.html" target="frame">
<label for="3">text</label>
</a>
<iframe name="frame"></iframe>