angular-material - MatTooltip 在整个项目中不会与其对象/按钮对齐，如何对齐？

Question

我正在使用 Metronic(从 themeforest 下载)构建一个项目。我正在使用它的角度版本，但我遇到了工具提示向左偏移的样式问题。

尝试重新安装angular、tooltip、hammerjs，但没有任何改变

在 pages.module.ts 中:

import { MatTooltipModule, MatInputModule, ... } from "@angular/material";
@NgModule({
declarations: [ ... ],
imports: [
    ...
    MatTooltipModule,

],
providers:[],
entryComponents:[
    // multiple components for my custom dialogs
]
});

当我实际使用它时:

<button matTooltip="tooltip"><mat-icon>new</mat-icon></button>

我还尝试使用具有所有可能值的 matTooltipPosition，但没有任何改变。

Link to image

正如您在图片中看到的，当我将鼠标悬停在按钮上时，实际的工具提示显示在按钮的左侧，没有与按钮对齐。*

Answer 1

我想通了

.cdk-overlay-pane{
    min-width:40vw;
}

在我的 styles.scss 中使每个对话框都足够大，但工具提示也使用了相同的类，因此使该 CSS 指令更具体或只是删除它可以解决问题。