example.html

<!-- Debugger is `height: 100%` making the full container only have the height of the viewport, not fitting the content. -->
<Debugger>
  <MainWrapper>
    <Splitter>
      <Panel1></Panel1>
      <Panel2></Panel2>
      <!-- 
        Trickle down here, you're having the height fixed so we have overflow that needs scrolling.
        This gets handled automatically, but the wrappers height is still fixed at "100%" of the viewport size.
      -->
      <Panel3>
        <Wrapper>
          <!-- When this hits that 100% height bottom, it becomes fixed to the bottom of that container an stops scrolling. -->
          <CommandBar></CommandBar>
          <!-- This will keep on going until it actually ends. -->
          <ScrollingContent></ScrollingContent>
        </Wrapper>
      </Panel3>
    </Splitter>
  </MainWrapper>
</Debugger>