twitter-bootstrap - 使用 angular-bootstrap 水平显示列表元素

Question

参考此链接http://jsfiddle.net/jenniferperrin/9sCME/我在我的 MVC 应用程序中实现了以下内容。

<ol class="rectangle-list">
  <li ng-repeat="item in freightlist" class="info"> 
    <a href="#"> {{item.link}} </a>
  </li>
</ol>

这工作正常，但如果我尝试放置更多另一个标签<span>，这样我就可以显示其他属性，如下所示

 <a href="#">{{item.link}} </a> <span>{{item.name}}</span> <span> {{item.city}}</span>

如我上面提到的链接所示，它无法正常工作，它正在逐行显示内容。

需要帮助来克服这一点。

Answer 1

Angular实际上，它与or无关Bootstrap。结果是逐行呈现的，因为您应用display: block了<a>标签：

.rounded-list a {
    display: block;
    ...
}

如果您将其删除，它将按照您的意愿并排显示。这是JsFiddle 上的结果。