时间戳

首页 > 解决方案 > 减少 UI 中按钮周围的间距

html - 减少 UI 中按钮周围的间距

问题描述

我正在为 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>

有人可以告诉我我该怎么做。 在此处输入图像描述

标签： htmlcssangularvmware-clarity

解决方案

似乎您的元素是根据 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;
}

推荐阅读