Question

这是JS Fiddle的live demo of the issue。我有一些jquery UI单选按钮，通过在body元素上设置font-family，按钮组之间突然出现空格，破坏了按钮的外观和连接性。它们看起来像这样：
enter image description here

更新：现在所有浏览器都会出现此错误，但每个浏览器略有不同。在所有情况下，font-family属性都是问题。

我在网站上添加了一些导致问题的最小CSS / HTML，我的网站的Themeroller CSS。你可以搞乱小提琴，当从body标签中删除font-family标签时，你会看到间隙消失。请注意，它不必是body标记，如果您将其设为div或其他适用于单选按钮的内容，则会发生这种情况。

这一点CSS足以打破它：

body{
font-family: Verdana, Helvetica, Arial, sans-serif;
}

有没有办法在没有jquery UI按钮的情况下为父元素指定字体系列？有趣的是，这个font-family没有被使用，因为Jquery UI主题的CSS也设置了单选按钮的字体。

Answer 1

我无法告诉你为什么会这样做，但如果你很乐意添加修复它的CSS代码，那么请使用：

#radio input, #radio label {
    float: left;
    margin-right: 0px;  
}

在回复下面的评论时 - 尝试将!important添加到margin-right;它看起来像是过度骑行。

#radio input, #radio label {
    float: left;
    margin-right: 0px !important;  
}