css - 如何将 mat-h​​orizo​​ntal-stepper 保持在页面中心

Question

我正在使用 Angular 6 mat-h​​orizo​​ntal-stepper。我想给它一些特定的宽度，并希望将它保持在页面中央。对于 mat-h​​orizo​​ntal-content-container，我可以将它保持在中心

.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;
}