Mixing radio with checked button in html
I want to mix radio and checked button as I design B here https://ux.stackexchange.com/questions/70531/using-mixed-radio-and-checkbox-buttons-is-there-any-efficiency-or-usability -ga
But I just could figure out how to do it separately:
<input class="radio-input" type="radio" name="result" value="names" />
<label class="radio-label">Get names of people starting with..</label>
<input type="checkbox" id="A" name="name[]" value="n">
<label for="A">A</label>
<input type="checkbox" id="B" name="name[]" value="n">
<label for="B">B</label>
How can I do it like in design B?
+3
source to share
1 answer
You will need to place them in separate divs and then align them next to each other using CSS styles.
.no-bullets {
list-style:none;
}
<h2>first row</h1>
<ul class = "no-bullets">
<li> <input type="radio" name="name"></li>
<li> <input type="radio" name="name"></li>
<ul class = "no-bullets">
<li><input type="checkbox" name="sex"></li>
<li><input type="checkbox" name="sex"></li>
<li><input type="checkbox" name="sex"></li>
</ul>
</ul>
</div>
0
source to share