Как исправить компонент topmenu?

#css #angular #angular-material #angular-flex-layout

#css #угловатый #angular-материал #angular-flex-layout #угловой

Вопрос:

Мне нужно, чтобы компонент topmenu был исправлен при прокрутке страницы. А компонент панели инструментов исчезает при прокрутке страницы.

Как это сделать?

HTML:

 <app-toolbar></app-toolbar>
<mat-sidenav-container>
    <mat-sidenav-content fxLayout="column">
        <app-topmenu></app-topmenu>
        <div fxFlex="1 1 auto">
            <router-outlet></router-outlet>
        </div>
        <app-footer ></app-footer>
    </mat-sidenav-content>
</mat-sidenav-container>
  

css:

 mat-sidenav-container {
    min-height      : calc(100% - 60px);
    height          : calc(100% - 60px);
    background-color: #eaeaea;
}

mat-sidenav-content {
    min-height: 100%;
    height    : 100%;
}
  

Ответ №1:

Попробуйте этот код, чтобы исправить положение верхнего меню.

 app-topmenu {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%
}
  

Комментарии:

1. Но это закроет компонент панели инструментов.

2. вы можете настроить положение в соответствии с вашими требованиями или вы можете показать мне демонстрацию своего кода через stackbliz? итак, я могу дать вам правильное решение.