【问题标题】:How to add space between text and radio button?如何在文本和单选按钮之间添加空格?
【发布时间】:2015-09-27 20:12:39
【问题描述】:

我希望文本和单选按钮之间有一个空格。为了实现这一点,我通过添加 margin-left: 7px 尝试了 css 类 answerBottomYesNo 。由于某种原因,它不起作用。 下面是代码sn-p

<div class="questionRow odd">
                <div class="question">
                    Ear Aches?
                </div>
                <div class="answers">
                    <label for="rbEarAches1"><span class="answerBottomYesNo" ><input type="radio" id="rbEarAches1" name="EarAches" value="true" data-bind="checked: EarAches">Yes</span></label>
                    <label for="rbEarAches0"><span class="answerBottomYesNo"><input type="radio" id="rbEarAches0" name="EarAches" value="false" data-bind="checked: EarAches">No</span></label>
                </div>
            </div>

我应该怎么做才能在单选按钮和文本之间留出一个空格。我本可以完成 nbsp 但我真的希望它驻留在 CSS 文件中。感谢您的帮助!

【问题讨论】:

  • 在单选按钮 {.answerBottomYesNo input[type="radio"]} 中添加边距

标签: html css asp.net


【解决方案1】:

代替span,将margin 添加到input type=radiospan,如下所示:

.answerBottomYesNo input[type="radio"]{
    margin-right:20px;
}

查看工作小提琴:https://jsfiddle.net/4ageousp/

【讨论】:

  • 谢谢!现在,如果我想为复选框添加相同的功能,我可以在同一个 CSS 类 answerBottomYesNo 中添加输入类型复选框吗?或者我必须为此创建一个新的 CSS?
  • 使用 .answerBottomYesNo 输入[type="radio"], .answerBottomYesNo 输入[type="checkbox"] { margin-right:20px; } 见小提琴jsfiddle.net/Lcqkdd3a/1
  • 太棒了!非常感谢:)