unexpected scrollable area with right:-Xpx + overflow:hidden

[paulrouget]

Even though the container has overflow: hidden, it's still scrollable. Note: overflow content is not visible, only body is visible.

<style>
  body {
    margin: 0;
  }

  .a {
    background: red;
    width: 100%;
    height: 100%;
    position: absolute;
    overflow: hidden;
  }

  .b {
    background: green;
    width: 40px;
    height: 40px;
    position: absolute;
    right: -40px;
  }

</style>

<div class="a">
  <div class="b"></div>
</div>