Since `line-height: 1.15` is set for `html`, vertical scrollbars appear on the table wrapper element

[baooab]

As described in the title，here show the code I'm using.

<style>
.table-wrapper {
  overflow: auto;
}

.table {
  border-collapse: collapse;
}
</style>

<div class="table-wrapper">
  <table class="table">
    <thead>
    <tr>
        <th>#</th>
        <th>Heading</th>
        ...
      </tr>
    </thead>
    <tbody>
      <tr>
        <th>1</th>
        <td>Cell</td>
        ...
      </tr>
      ...
    </tbody>
  </table>
</div>

Online demo: https://codepen.io/zhangbao/pen/mYeNzb

To my surprise, unexpected vertical scroll bars appear on the table wrapper element.

I found that because normalize.css sets the line-height: 1.15 for html, and if I set the line-height to a value of 1.2 or greater, the vertical scrollbar disappears.

I want to know what the reason is, thank you !

[dhurlburtusa]

Thanks for creating the codepen for the repro.

I looked but I don't see any vertical scrollbars. I tried with Chrome 74. I tried with different zoom levels. But I can reproduce the issue.

What browsers are you seeing it in? Can you post a screen shot?

[baooab]

I am sorry for not telling you clearly.

The problem is the desktop computer of my company, using Chrome 74. Normal zoom is no problem, but when I change to 110% zoom, the vertical scrollbar appears.

[Toddses]

The reason it's there is to normalize the value across all browsers. Most browsers default to 1.15, but not all, so it's normalized in this project.

769 is a relevant PR.