使用ng-repeat时，不能对齐文本

Question

我正在构建一个Ionic应用程序，但遇到了一个我不理解但似乎无法解决的小问题。

我有一个硬编码的离子项和一个使用ng-repeat生成的离子项。我使用css将文本放在两个文本中心，但是，与硬编码相比，使用ng-repeat生成的离子项比左侧稍微多一点。 当我使用离子视图和模板时，这似乎只是一个问题。如果我将代码移动到index.html，它们都会正确居中。

有什么想法导致它以及我可以采取哪些措施来解决它？

链接到plunker：plnkr.co/edit/tUM7pL54OlyCQwr2qu3o?p=preview

Html结构：

$model->validate()

谢谢， 卡斯帕

Answer 1

您的问题是ui-sref标记，它添加＆＃34;项目内容＆＃34;类自动生成的离子项，此类将padding: 16px 49px 16px 16px;添加到您的元素。如果删除ui-sref，则生成的离子项将居中。

Answer 2

ui-sref指令为每个<a>创建<ion-list> 如果你想要对齐两者，你需要调整CSS，如果新创建的元素没有填充

通过添加此类，您可以覆盖默认样式并保留您的ui-sref

a.item-content {
  padding-left:0px !important;
  padding-right:0px !important;
}