dotnet / dotnet/docfx

[Bug] Navigation area left-margin is changed when navigating between pages

Open
#9,951 0 comments 0 reactions 0 assignees View on GitHub
template
Dominant language
C#
Stars
4.4k
Forks
890
Avg merge
2h 11m
Merged PRs (30d)
10

Description

**Describe the bug**
When navigate between docfx site pages.
Margin of top navigation area is shifted when displaying some pages.

**To Reproduce**
Steps to reproduce the behavior:
1. Open Chrome or Edge browser. And set window width larger than `1768`.
2. Navigate between following pages
2.1. https://dotnet.github.io/docfx/api/Docfx.BuildOptions.html
2.2. https://dotnet.github.io/docfx/api/Docfx.MemberLayout.html
3. Confirm top navigation area position is shifted 15px between pages.

**Expected behavior**
Navigation area is not shifted between pages.

**Context (please complete the following information):**
- Browser: Chrome, Edge (not occurred when using FireFox)
- Form factor: Desktop
- Docfx version: 2.76.0
- Template: modern

**Additional context**
It seems different margin behaviors are caused by scrollbar is displayed or not.

By `layout.scss`. html's width is explicitly set. But it seems not works as expected.
https://github.com/dotnet/docfx/blob/main/templates/modern/src/layout.scss#L28

Because `--scrollbar-width` is not defined and actual view width (without scrollbar width) is used.
It need to exclude `scrollbar width` regardless of whether a scrollbar is displayed or not.

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.