unexpected overflow

[paulrouget]

The following example makes the body element scrollable. The extra area is apparently directly related to the horizontal padding.

<style>
  body {
    margin: 0;
  }

  .green {
    background: #0F0;
    height: 40px;
    width: 400px;
    top: 40px;
    left: 50%;
    margin-left: -300px;
    position: absolute;
    padding: 0px 100px;
  }

  .red {
    background: #F00;
    position: absolute;
    right: 0;
  }

</style>

<div class="green">
  <span class="red">x</span>
</div>

[glennw]

I can reproduce this bug with the following smaller code:

<style>
  body {
    margin: 0;
  }

  .green {
    background: #0F0;
    height: 40px;
    width: 600px;
    margin-left: -300px;
  }
</style>

<div class="green">
</div>

I think the problem is that negative margins are accumulated into the overflow rectangle, which is then used to determine whether a region is scrollable or not. I think Patrick mentioned something a while ago about Gecko having separate concepts for visual overflow vs. scrollable overflow - would that be relevant here? @pcwalton How should we handle this case in layout?

[paulrouget]

@glennw do you think this is related to #9308 and #9309?

[pcwalton]

If negative margins are accumulated into the overflow rect, then that should be easily fixable.

[pcwalton]

There are actually two bugs here. One, which @glennw's test case displays, is that overflow: scroll should not allow you to scroll past the top left corner of the scrollable element (including the body). Fixing this issue fixes that test case. However, the original bug remains for an unknown reason.

[pcwalton]

It looks like the second bug is an incremental reflow bug relating to inline absolute hypothetical fragments.