如何将水平垫板保持在页面中心

Question

我正在使用Angular 6垫水平步进器。我想给它特定的宽度，并希望将其保持在页面中心。 对于水平垫料容器，我可以将其保持在中心位置

.mat-horizontal-content-container 
    text-align: center;
    overflow: hidden;
    padding: 0;

但是如何使页眉保持在页面中心。我正在尝试这样做，但无法正常工作。

.mat-stepper-label-position-bottom .mat-horizontal-stepper-header-container 
    width: fit-content !important;
    align-items: center;

有人可以帮我吗？

Answer 1

您还需要添加：margin: 0 auto。

.mat-stepper-label-position-bottom .mat-horizontal-stepper-header-container {
    width: fit-content;
    margin: 0 auto;
}

Answer 2

尝试深入

  /deep/.mat-horizontal-content-container {
        text-align: center;
        overflow: hidden;
        padding: 0;
    }

很快就会弃用替代方法，就像在style.css中那样在全局css文件中编写样式