如何在Dialog角材料内的右上角对齐按钮？

Question

我想在对话框有角材料的右上角对齐按钮。问题是我在按钮和对话框的角之间有一些空间，我不想要它。

这是我的html代码：

 <button #btnClose mat-button class="close" data-dismiss="modal" aria-label="Close">
   <span aria-hidden="true">&times;</span>
 </button>

这是我的CSS代码：

.close {
  color: black;
  opacity: 1;
  max-width: 2vw !important;
  min-width: 2vw !important;
}

我可以用裕度在CSS中做一些“技巧”，但是我认为这是个坏主意：

.close {
  color: black;
  opacity: 1;
  max-width: 2vw !important;
  min-width: 2vw !important;
  margin: -1.2vw -1.2vw;
}

然后我得到了想要的东西：

有更好的解决方案吗？ 附注：它必须具有响应性。

Answer 1

如果要在右上角对齐某些内容，可以使用：

.close {
  position: absolute;
  top: 0;
  right: 0;
}