Javascript 为什么jqueryUI按钮和buttonset的位置不同？

我有很多按钮，它们应该显示在彼此下面。在某些行中，应该只有一个按钮，而其他行应该包含两个带有jQueryUI按钮集的按钮

下面是一个示例代码：

$（“按钮”）.button（）；
$（“.split”）.buttonset（）
div{
宽度：280px；
文本对齐：居中；
}
div按钮{
宽度：70%；
}
按钮，向左{
宽度：55%；
}
按钮，右边{
宽度：15%；
}

点击我！
拆分按钮
B
取消设置按钮上的水平边距，以便正确计算中心。同时移除两个按钮之间的“空格”：


$（“按钮”）.button（）；
$（“.split”）.buttonset（）
@导入url(https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css);
div{
宽度：280px；
文本对齐：居中；
}
.regular.ui按钮{
右边距：0；
宽度：70%；
}
.分开，向左分开{
右边距：0；
宽度：55%；
右边框宽度：0；
}
.分开，分开，对吗{
右边距：0；
宽度：15%；
}

点击我！
分钮b
因为它们有边距。@没错，这就是技术原因。但是为什么开发人员选择了这些不同的格式，使得我眼中的两个非常相似的概念有些不兼容？这种方法的一个小缺点是按钮之间的边界现在是原来的两倍厚。从第一个按钮中删除右边界。悬停时缺少的右边框变得更加明显，但在原始示例中也存在同样的问题。我宁愿住在双重边界。