【问题标题】:How to give space between radio button and radio button text如何在单选按钮和单选按钮文本之间留出空间
【发布时间】:2017-05-03 23:10:16
【问题描述】:

这是我在struts标签中的单选按钮代码,单选按钮和单选按钮文本框之间的空间拥挤如何在它们之间留出空间

  <div class="form-group">
    <label class="col-lg-3 control-label">Gender</label>
    <div class="col-lg-5">
    <div class="btn-group" data-toggle="buttons">
    <s:radio name="studentDTO.s_gender" id="gender" list="{'Male','Female'}" />
    </div>                              
    </div>
    </div>

【问题讨论】:

标签: css struts2


【解决方案1】:

许多 HTML 元素都有默认的边距设置。您可以覆盖它并将其设置为 0。在您的情况下,您希望在单选按钮上重置 margin-right:

   &lt;input type="radio" name="beds" value="1" style="margin-right: 0" /&gt;1+

您可能希望将它添加到您的样式表中,以便它适用于所有单选按钮:

input[type="radio"] {
  margin-right: 0;
}

【讨论】:

【解决方案2】:

我知道这是一个老问题,但要在 Struts 2 中执行此操作,如果您只想将其应用于这组单选按钮,请使用 cssStyle 属性。

<s:radio name="studentDTO.s_gender" id="gender" list="{'Male','Female'}" cssStyle="margin-right:20px" />

或者您可以使用cssClass 属性。

<s:radio name="studentDTO.s_gender" id="gender" list="{'Male','Female'}" cssClass="radioMarginRight" />

.radioMarginRight{
margin-right: 20px !important;
}

这两个都将CSS 应用于单选按钮和标签。为了防止边距应用于具有cssClass 属性的标签,您可以定义以下CSS 将标签边距设置为0。

label.radioMarginRight{
margin-right: 0px !important;
}    

【讨论】:

    【解决方案3】:

    我不知道struts,但是看看这个你试过吗:

    list="{'男','女'}"

    只是在每个 ' 之间放置一些空格。

    它是你在 HTML + CSS 中所做的,所以可能在那里工作

    【讨论】: