如何在文本和单选按钮之间添加空格？ [英] How to add space between text and radio button?

问题描述

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

 < div class =questionRow odd> 
< div class =question> 
耳朵疼痛？ 
< / div> 
< div class =answers> 
< label for =rbEarAches1>< span class =answerBottomYesNo>< input type =radioid =rbEarAches1name =EarAchesvalue =truedata-bind =checked：EarAches>是< / span>< / label> 
< label for =rbEarAches0>< span class =answerBottomYesNo>< input type =radioid =rbEarAches0name =EarAchesvalue =falsedata-bind =checked：EarAches>否< / span>< / label> 
< / div> 
< / div> 
  

我应该如何在单选按钮和文本之间留出空间。我可以完成nbsp，但我真的希望它驻留在CSS文件中。 c> margin 到 input type = radio 在 span 内部像这样：

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

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

I want single space between the text and radio button. To achieve this I tried the css class answerBottomYesNo by adding margin-left: 7px . for some reason it did not work. Below is code snippet

<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>

What should I do to give a space between the radio button and text. I could have done nbsp but I really want this to reside in the CSS file. Help appreciated!

解决方案

Instead of span, add margin to input type=radio inside the span like this:

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

See the working fiddle: https://jsfiddle.net/4ageousp/

这篇关于如何在文本和单选按钮之间添加空格？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！