title: How to keep webcam video centred when the height is 100% of the screen and the window is resized
body: <p>Using React I have a webcam video that must be centered at all times while the video's height is 100% of the screen height. I have the video filling the screen vertically fine but if I change the width of the window the video doesn't stay centered.</p>
  
  <pre><code>return (
    &lt;div style={style.container}&gt;
      &lt;video style={style.video}
             ref={this.videoRef}
             autoPlay={true}&gt;&lt;/video&gt;
    &lt;/div&gt;
  )
  
  const style = {
    container: {
      position: 'absolute',
      width: '100%',
      height: '100%', 
      overflow: 'hidden',
    },
    video: {
      transform: 'rotateY(180deg)',
      height: '100%',
      objectFit: 'contain',
      objectPosition: 'center'
    }
  }
  </code></pre>
  
  <p>With the above, currently, the video just hugs the left of the window. </p>