How to change spacing between radio button and its text?

前端 未结 3 1239
陌清茗
陌清茗 2020-12-15 03:17

I have the following HTML:

相关标签:
3条回答
  • 2020-12-15 03:37

    You can add this to your stylesheet:

    input[type="radio"] {  
      margin-right: 10px;
    }
    
    0 讨论(0)
  • 2020-12-15 03:39

    Many HTML elements have a default margin setting. You can override this and set it to 0. In your case, you want to reset margin-right on the radio button:

    <input type="radio" name="beds" value="1" style="margin-right: 0" />1+
    

    You probably want to add it to your stylesheet so that it applies to all radio buttons:

    input[type="radio"] {
      margin-right: 0;
    }
    
    0 讨论(0)
  • 2020-12-15 03:46

    You'll need the label element.

    <input type="radio" name="beds" value="1" id="first" /><label for="first">1+</label>
    <input type="radio" name="beds" value="2" id="second" /><label for="second">2+</label>
    

    You can then style this like this:

    label {
      margin-left: -3px;
    }
    

    Also note the use of the for attribute for accessibility purposes.

    0 讨论(0)
提交回复
热议问题