--- lang: ja-jp breaks: true --- # Blazor FluentUI メニューアイテムが多い場合に フッターが途中に表示される 2024-01-27 ![image](https://hackmd.io/_uploads/BkC_vkM9a.png) ## プロジェクトテンプレート ![image](https://hackmd.io/_uploads/SyLavkMqa.png) ![image](https://hackmd.io/_uploads/HkcCvJG5a.png) ## 修正方法 ### `NavMenu.razor.css` に以下を追加する ```css= nav.sitenav { background-color: var(--neutral-layer-1); padding: 1.5rem 1rem; height: calc(100dvh - 90px); overflow-y: auto; } ``` * メニューアイテムが多い場合はスクロールバーが表示されてフッターが末尾に表示されるようになる。 ![image](https://hackmd.io/_uploads/BkCNdJM5p.png) ###### tags: `Fluent UI Blazor` `Blazor` `FluentUI` `メニューアイテム` `フッター`