使用 angular material 在相机扫描仪的右上角设置一个关闭图标

Question

我有这个 .scss 代码：

.closed{
    padding: .5rem;
    width: 1.5rem;
    height: 1.5rem;
    line-height: 1.5rem;
    text-align: center;
    background-color: #fff;
    cursor: pointer;
    border: 2px solid rgb(53, 52, 52);
    font-size: 1.3rem;
    margin: -1rem;
    border-radius: 2rem;
    z-index: 100;
    box-sizing: initial;
}

和这个 html 代码：

<mat-dialog-actions align="right">
    <button class="closed" (click)=closed()>X</button>
</mat-dialog-actions>
<mat-dialog-content>
    <div id="interactive" class="viewport">
    </div>
</mat-dialog-content>

在这里我有两个问题，首先是响应速度，我的视频在某些设备上无法正常工作。第二个关闭按钮我想放在右上角没有在左上角。

你能告诉我如何解决问题吗？

Answer 1

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

如果不起作用，请尝试将 position:relative 放在 mat-dialog-actions

上

使用 angular material 在相机扫描仪的右上角设置一个关闭图标

Set a close icon in the top right on camera scanner using angular material

angular-material

angular