search

mozmorris / react-webcam

Webcam component
https://codepen.io/mozmorris/pen/JLZdoP
MIT License
1.65k stars 281 forks source link

making react-webcam responsive for mobile #327

Closed furkandindar closed 2 years ago

furkandindar commented 2 years ago

I am trying to build an app using react-webcam. This app needs to be mobile responsive. I use Material UI Grid to make it responsive, always overflows and causes a horizontal scroll on mobile browsers. Is there a way to handle this? Thanks in advance!

` <Grid item xs={12} sm={8} md={6} lg={6} xl={6} style={{background:"green"}}>

      </Grid>

`

here, Grid's green background fits in the mobile browser perfectly but WebcamCapture overflows it.

mozmorris commented 2 years ago

You will need to apply styling to the component using the style prop, a starting point would be something like:

<Webcam style={{ width: "100%" }} />