Javascript 基础按钮组普通HTML和NG重复不同的结果 我把我的基金会版本从5.3.3升级到5.5.2。一切都很好，除了按钮组之类的元素。这里有一个例子 <div class="row"> <div class="small-6 columns"> <ul class="button-group even-2"> <li ng-repeat="i in [1, 2]"> <a href="#" class="button tiny">{{i}}</a> </li> </ul> <ul class="button-group even-2"> <li><a href="#" class="button tiny">1</a></li> <li><a href="#" class="button tiny">1</a></li> </ul> </div> </div>

这两种方法将产生不同的结果。角度

ng repeat

指令将产生较小的结果。这怎么会发生

我创建了一些可复制的示例。第一个是不起作用的例子

例1： 基金会5.5.2/P>

第二个示例如预期的那样工作，但使用较旧的基础版本。

例2： 基金会5.3.3

角度的版本没有改变。有人知道如何解决这个问题吗

即使没有

偶数-*

类的示例也会产生不同的结果

---

干杯。

有关说明，请参见此处：

这是由于ng重复添加

li

s，其间没有空格，其中手动创建的有空格，这是由于回车和对齐标签造成的

有关您的工作示例，请参见此处：

鉴于5.5.2是：

.button-group.even-# li {
  display: inline-block;
  margin: 0 -2px;
  width: 14.28571%;
}

同样，重要的部分是

内联块

。内联块使每个元素之间的任何空格显示为一个空格

---

如果您想知道为什么要添加它，那么它似乎是为了支持按钮堆叠而添加的。这里是提交

问题在于

边距：0-2px

在

.button-group.偶-2 li和
.button-group>li
上。使用开发人员工具，删除这两条规则会使所有内容的宽度相同。然而，它使非ng重复的两行上。。。我似乎找不到解决方案。我创建了另一个示例，其中您的解决方案不起作用。我必须使用另一个保证金值。您可以在这里玩：这样全局覆盖就不起作用了：（看起来角度和基础不能很好地配合。我发现内嵌的块元素在NG-Real.编辑的答案中有问题。结果不是bug，而是一个特性！谢谢，这解释了为什么，但是行为是错误的。为什么它在5.3.3的基础上工作？代码完全一样。推特引导帧k没有这个问题。在我看来一定是出了什么问题。。。
.button-group>li {
  margin: 0;
  float: left;
}

.button-group.even-# li {
  display: inline-block;
  margin: 0 -2px;
  width: 14.28571%;
}