css - 只能选择第一个单选按钮，并将内联 block 应用于标签

Question

这是一系列包含在 label 元素中的三个 radio 按钮。 display: inline-block 应用于标签。由于某种原因，只能选择第一个标签，尽管在 Firebug 上所有标签都分开显示:

Fiddle

Answer 1

您必须为每个标签使用 1 个 ID。您还需要一个组名，该组名必须与其他选项中的相同。

<label for="pa_couleur1">
    <input type="radio" name="color" id="pa_couleur1" value="blanc">blanc
</label>
<label for="pa_couleur2">
    <input type="radio" name="color" id="pa_couleur2" value="bleu">bleu
</label>
<label for="pa_couleur3">
    <input type="radio" name="color" id="pa_couleur3" value="marron">marron
</label>

https://jsfiddle.net/0jLdst52/5/