CSS：如何更改单选按钮和它的文本之间的间距？ [英] CSS: How to change spacing between radio button and it's text?

问题描述

如何更改单选按钮与其文本之间的间距？

How do I change the spacing between radio button and it's text?

我有以下HTML：

<input type="radio" name="beds" value="1" />1+
<input type="radio" name="beds" value="2" />2+

>

Which produces something like this graphic:

o 1+ o 2+

b $ b

如何更改单选按钮和1+文本之间的间距？我希望文本更接近单选按钮，但浏览器在两个元素之间插入一些未定义的填充。

How do I change the spacing between the radio button and the "1+" text? I'd like the text to be closer to the radio button but the browser is inserting a certain about of undefined padding between the two element.

推荐答案

许多HTML元素都有默认的边距设置。您可以覆盖此值并将其设置为0.在您的情况下，您要在单选按钮上重置 margin-right ：

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

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