Scroll percentage starts at 33%?

[Matt Masurka]

I am using it as the outer-most component in my app, but the scroll percentage only goes from 0.33 to 0.66 -- any idea why that might be?

      <ScrollPercentage>
        {({percentage}) => (
        <AnimatedBg>      
          <Transition from="#111" to="#eee" position={0}>
            <LandingPage 
              scrollToNextPage={this.scrollToNextPage}
              percentage={percentage}/>        
          </Transition>
          <div 
            ref={(section) => { this.pageTwo = section; }} 
            style={{ height: '100vh' }} />
          <h1 style={{top: 0, right: 0, position: 'fixed', color: 'red'}}>{percentage}</h1>
        </AnimatedBg>
        )}
      </ScrollPercentage>

[Daniel Schmidt]

Can you recreate an example in http://codesandbox.io/ ? You'd most likely see something like that if the document height is less than the viewport height.