"Advanced Sass" was retired on March 24, 2020.

Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

HTML

Posted by Phillip Elkins
.a{fill-rule:evenodd;}techdegree
Phillip Elkins
Front End Web Development Techdegree Student 14,875 Points

How do I re-sizing video using the HTML5 Video Tag?

I have two videos that I want to place in my site using HTML5 Video Tag but they are different height and widths, how would I go about re-sizing the video so that they are the same size?

Or should I edit video in another program like Final Cut and then import it to my site?

2 Answers

Dustin Matlock
Dustin Matlock
33,856 Points

Hi Phillip, you can do this using <video> attributes.

For example:

<video width="560" height="315" controls>
    <source src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge.mp4" type="video/mp4">
    <source src="http://treehouse-code-samples.s3.amazonaws.com/html-video-and-audio/bridge.ogg" type="video/ogg">
</video>
Phillip Elkins
.a{fill-rule:evenodd;}techdegree
Phillip Elkins
Front End Web Development Techdegree Student 14,875 Points

Thank you! :) It work.

Chunwei Li
Chunwei Li
18,816 Points
Chunwei Li
Chunwei Li
18,816 Points

Are you using the same height and width attributes on two videos?

Phillip Elkins
.a{fill-rule:evenodd;}techdegree
Phillip Elkins
Front End Web Development Techdegree Student 14,875 Points

Yes, inside the HTML5 video tag