如何让我的离子按钮“更苗条”？

Question

我一直在使用开发者工具尝试使离子按钮“像药丸一样”，因此按钮很窄。一个接近的例子就像堆栈溢出上的按钮，例如“Ask Question”按钮。文本的顶部和底部没有太多间距。

如何使用我的按钮实现这种效果？这是一个代码栈，显示我正在尝试修改的按钮：

http://codepen.io/anon/pen/MKPdey

 <button class="button button-small button-calm">
         hello I'm a small button
    </button>

Answer 1

您必须覆盖padding和min-height：

.button.button-small.button-calm {
  min-height: 0;
  padding-top: 0;
  padding-bottom: 0;
}

这是codepan fork

如果仍然不够，请更改line-height：

.button.button-small.button-calm {
  line-height: 100%; /* play with this to fit your needs */
}