如何更改单选按钮之间的填充/边距？答案

【问题标题】：How to change the padding/margin between radio buttons?如何更改单选按钮之间的填充/边距？
【发布时间】：2013-01-07 21:39:33
【问题描述】：

谁能告诉我如何使单选按钮看起来更靠近彼此？（他们目前看起来都相距很远）

请查看this link，

我尝试如下使用“padding-left”，但这并没有解决我的问题。谁能告诉我到底出了什么问题？

我试过了：

.gform_wrapper .left_label ul.gfield_checkbox,
.gform_wrapper .right_label ul.gfield_checkbox,
.gform_wrapper .left_label ul.gfield_radio,
.gform_wrapper .right_label ul.gfield_radio {
  margin-left: 32%;
  overflow: hidden;
  padding-left: 20px;
}

【问题讨论】：

我认为你必须使用表格来对齐任何你想要的地方

标签： html forms css radio-button

【解决方案1】：

使用这个：

<label for="choice_6_0" style="width: 50px;">Male</label>

并为男性等所有标签添加宽度

【讨论】：

【解决方案2】：

您的各种 CSS 文件中有几个相互矛盾的规则。
例如，this 说

.wpcf7-form label, #main-content .gform_wrapper label {
    float: left;
    width: 70px;
}

this 说

#main-content .gform_wrapper label { width: 200px; }

后者恰好覆盖了前者，但这只是因为您稍后包含了第二个文件。

因此，您可以删除第二行中的行，或更改包含 CSS 文件的顺序。

【讨论】：

【解决方案3】：

假设您将有 2 行，每行有 2 个单选按钮，就像您提供的链接一样。

第一行

<div class="radioDiv">
   <input type="radio" name="group1" class="leftRadio" value="male"/>
   <input type="radio" name="group1" class="rightRadio" value="female"/>
</div>

二线

<div class="radioDiv">
   <input type="radio" name="group2" class="leftRadio" value="single"/>
   <input type="radio" name="group2" class="rightRadio" value="married"/>
</div>

CSS

.radioDiv
{
   width:200px;
}
.leftRadio
{
   float:left;
}
.rightRadio
{
   float:right;
}

【讨论】：

【解决方案4】：

您需要更改“男性”、“女性”等标签的宽度。我会为这些标签添加一个类，这样它们就不会从其他规则中获得 200 像素的宽度。理论上，

<li class="gchoice_6_0">
   <input name="input_6" type="radio" value="Male" id="choice_6_0" tabindex="4" onclick="gf_apply_rules(3,[0]);">
   <label for="choice_6_0" class="radioLabel">Male</label>
</li>

然后将以下规则添加到您的 css 中

#main-content .gform_wrapper label.radioLabel {
    width:30px; //Adjust this width for the result you want. 
}

【讨论】：

【解决方案5】：

试试这个可能会减少单选按钮之间的空间。

.ginput_container ul li label{width:120px;}

【讨论】：

【解决方案6】：

#main-content .gform_wrapper label {
  width: 200px;
}

此规则适用于您的单选按钮标签，这就是您在项目之间留出如此大空间的原因。

【讨论】：