【问题标题】:Spacing between checkbox and text?复选框和文本之间的间距?
【发布时间】:2020-09-14 02:20:45
【问题描述】:

我无法弄清楚如何添加自定义 CSS 以在复选框和文本之间添加间距(运送到不同的地址?)。任何时候我添加边距或填充整个元素(复选框+文本)都会移动。见附图? 感谢您的帮助!

https://roynattivmd.com/checkout/

复选框和文本:

【问题讨论】:

  • 您能否在此处使用代码重新创建一个小问题示例,以便我们轻松处理它?
  • 是的,我们需要您当前的 html 和 css 代码

标签: css woocommerce woocommerce-checkout-fields


【解决方案1】:

您可以通过将margin-right: [value]; 添加到特定输入来添加一些间距。由于您使用的是elementor,因此您可以通过内联样式来执行此操作。

<label for="myInput">
  <input id="myInput" type="checkbox" style="margin-right: .5rem;">
  Ship to a different address?
</label>

或者通过外部样式表:

#myInput {
  margin-right: .5rem;
}
<label for="myInput">
  <input id="myInput" type="checkbox">
  Ship to a different address?
</label>

【讨论】:

  • 由于这是一个Bootsrap网站,添加mr-1作为类名不需要你编辑任何代码
  • 如果您愿意,可以根据您的建议编辑我的答案。
  • 谢谢,但我认为这不是必需的,我想一个评论就足够了。
  • 那是因为我很好奇...也许我的问题是我该把那个课放在哪里。
  • 已审核,接受您的更改。谢谢。我误解了你所说的。
【解决方案2】:

请试试这个代码,复选框和文本之间的间距?

    dd label input {
           margin-right:10px;
        }
    <dd id="rr-element">
           <label for="rr-1">
              <input type="checkbox" value="1" id="rr-1" name="rr[]">
              Value 1
           </label>
        </dd>

我希望这段代码有用。

谢谢。

【讨论】:

    猜你喜欢
    • 2011-05-01
    • 1970-01-01
    • 2012-10-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多