文本和按钮未在卡列表中对齐

Question

我正在使用Ionic构建移动应用程序。在卡片列表中对齐文本后，我无法获得按钮。

守则：

<div>
  {{ match.location }} <button class="button button-icon ion-ios-information-outline"></button>
</div>

我看到以下

Answer 1

  

造成这个问题的原因是什么？

此问题是因为button类具有line-height和min-height的高值。

  

解决方案

选项1

您可以将以下CSS添加到按钮

button{

  line-height:0!important;
  min-height:0!important;
}

这里是demo

选项2

或者，删除按钮类并且只有button-icon类。在这种情况下，您不需要为button-icon添加样式。

这是demo