Responsive `width`

Hi, Is it possible to make the <ReactPlayer> width responsive? For example to inherit the width of the div or td in which is placed? Thanks

[cookpete]

You should be able to pass 100% to the width and height props and it will fill it’s container. If you want responsive width and aspect ratio, do something like this:

.wrapper {
  position: relative;
  padding-top: 56.25% /* Player ratio: 100 / (1280 / 720) */
}

.player {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

<div className='wrapper'>
  <ReactPlayer
    className='player'
    playing
    url={...}
    width='100%'
    height='100%'
  />
</div>

[cookpete]

This would be very helpful to include in the README.

Nearly a year late but it’s finally in there: https://github.com/CookPete/react-player#responsive-player 😞