0

I am using react-responsive-carousel to create a carosouel of youtube videos as in http://react-responsive-carousel.js.org/storybook/?path=/story/02-advanced--youtube-autoplay-with-custom-thumbs.

I want to remove the blackbox on the sides as shown in the image. with black sides

I used <ReactPlayer width="100%" url={url} playing={isSelected} height="100%" /> .

When I try width=120% I somewhat get the result I want. with one black side

Is there any way to get the video in the center so that to cover the full area with no black spaces on either sides.

Prajwol Gyawali
  • 11
  • 2

1 Answers1

0

You can center the player by using the style.

<ReactPlayer style={{margin:"auto",text-align:"center",width="100%"}} url={url} playing={isSelected} height="100%" />

Stars Tracker
  • 762
  • 1
  • 10
  • 24