减少 UI 中按钮周围的间距

Question

我正在为 UI 使用 VMware 清晰度，并希望减少按钮左侧和右侧的间距，即 PDF 按钮、ZIP 按钮。我尝试将填充设置为 0，甚至是负填充，但它不起作用。 下面是代码：

<button type="button" class="btn btn-sm" style="margin: 0%; padding: 0%;" (click)="pdf_report(hist)">
      <clr-icon class="is-solid" shape="file"></clr-icon>PDF     
</button>

谁能告诉我该怎么做。

Answer 1

您的元素似乎是根据 flex 行为显示的。 首先，您应该使用您的开发工具找到关于 button.btn.btn-sm 元素的样式的实现位置。如果您无法更改它，您可以尝试通过添加页面/元素/查看您的 css 代码来使用重要属性覆盖它，如下所示：

button.btn.btn-sm{
  display:inline-block!important;
  flex:none!important;// this will break the flex behavior
  padding:0!important;
  width:auto;
}