How do I resize the videos I put in my programs.

Question

I put a video and when I run the program the video shows up even bigger than my laptop screen.

Answer 1

Could you post a small, representative sample in CodePlayground? In general you can use CSS to resize the element (e.g., width: 100vw; height:100vh) but that really may depend on a few things and people here probably won't mind the opportunity to practice.

Answer 2

Please use the code playground so we can see what the output is. It will make it easier for us to help you.

Answer 3

video tags are text 'inline' elements; display:block switches them to allow repositioning and 'margin' does the actual move.

Simpler version:

video {
margin-left:auto;
margin-right:auto;
display:block;
}

Play-with-values version:

video {
border:1px dashed darkgrey;
width: 45vw;
height: 70vh;

margin:0 auto;
display:block;
}

If you're going to center more than one video, you may want to use a CSS class instead.

Answer 4

Thanks

Answer 5

<video height="auto" width="100%"></video>

or if you embed youtube video,

<iframe height="auto" width="100%"></iframe>

Answer 6

https://code.sololearn.com/WUl47316ErGc/?ref=app

Answer 7

Okay. I resized but then how do you change horizontal alignment of the video cuz I tried using align attribute but it's not working.