Empty space where scrollbar lives on Windows Chromium browsers with `scrollbar-gutter: stable`
Open
Nobody has claimed this yet.
css
v6
- Dominant language
- MDX
- Stars
- 175k
- Forks
- 78.6k
- Avg merge
- 7h 19m
- Merged PRs (30d)
- 35
Description
Prerequisites
- I have searched for duplicate or closed issues
- I have validated any HTML to avoid common problems
- I have read the contributing guidelines
Describe the issue
v5
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bootstrap demo</title>
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-sRIl4kxILFvY47J16cr9ZwB07vP4J8+LH7qKQnuqkuIAvNWLzeN8tE5YBujZqJLB"
crossorigin="anonymous"
/>
<style>
html,
body {
border: 1px solid red;
}
</style>
</head>
<body>
<h1>Hello, world!</h1>
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.8/dist/js/bootstrap.bundle.min.js"
integrity="sha384-FKyoEForCGlyvwx9Hj09JcYn3nv7wiPVlz7YYwJrWVcXK/BmnVDxM+D2scQbITxI"
crossorigin="anonymous"
></script>
</body>
</html>
v6
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<title>Bootstrap demo</title>
<link href="dist/css/bootstrap.min.css" rel="stylesheet" />
<style>
html,
body {
border: 1px solid red;
}
</style>
</head>
<body>
<h1>Hello, world!</h1>
<script type="module" src="dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>
Reduced test cases
no
What operating system(s) are you seeing the problem on?
Windows
What browser(s) are you seeing the problem on?
Chrome
What version of Bootstrap are you using?
v6-dev
Contributor guide
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
Research direction
Start with the provided minimal HTML reproductions and compare the behavior in Windows Chrome for Bootstrap v5.3.8 and v6-dev. Inspect the generated Bootstrap CSS involved in scrollbar layout, then verify the empty gutter is gone without regressing normal scrollbar behavior in both versions.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- css
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Quiet
- Clarity
- Mostly clear
- Newbie friendliness
- 48/100