html - 如何将单选按钮对齐到我的文本的左侧?

标签 html css

所以对于我的 raid 按钮,我希望它们与我的文本右侧对齐,就像上面的其他元素一样,但我不知道如何对齐。 这是我的按钮的 fiddle 和代码。

<label>What kind of Ice Cream you like?</label>
<label><input type="radio" name="icecream" value="choco" id="radio">                     Chocolate</label><br>
<label><input type="radio" name="icecream" value="vanil" id="radio">Vanilla</label><br>
<label><input type="radio" style="vertical-align: middle" name="icecream" value="rocky" id="radio">Rocky Road</label><br>

https://jsfiddle.net/russiandobby/gfj1nper/4/

我尝试了很多方法,但我的单选按钮要么在文本下方结束,要么像这样弄乱了顺序。

最佳答案

尝试为每个 radio 使用一个 id,如下所示:

<div>
    <label for="chocolate">Chocolate</label>
    <input type="radio" name="icecream" value="choco" id="chocolate"> 
</div>

*编辑

关于html - 如何将单选按钮对齐到我的文本的左侧?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54413640/

相关文章:

javascript - 如何构建这些自定义 Box-shadow css3 效果?

java - Primefaces-表单提交后文本框项目不会消失

jquery - 针对列表中的特定类

php - 使用 MySQL 数据库的 HTML\PHP 中的下拉菜单

html - 在生成的 HTML .doc 中插入分页符

javascript - 键入时搜索并显示表值

css - 动态调整内容框中的文本大小

css - 在 VS 代码中更改颜色 CSS/SASS?

html - 在右侧 float 一个 "<li>"的字体图标

css - css 正则表达式