HTML5 video element width and height attributes question

Question

Can the html5 video elements width and height attributes have a pixel and percentage value?

If so are these the only values allowed?

Do I have to add the percentage and pixel prefixes at the end of the value?

Answer 1

Based on the W3C specification width and height define the video size in CSS pixels, not percentages. So setting a % value won't work.

<!-- No `px` at the end of the value like CSS -->
<video width="980" height="560" ... > ... </video>

It’s always best to specify the height and width attributes so that the page doesn’t need to reflow. If pixel values doesn't work for you, don't specify the video dimension attributes and instead use the style attributes to specify the height and width in percentage values.

<!-- Let's supposed you want the video to adjust to the size of its parent element -->
<video style="outline:none; width:100%; height:100%;" ... > ... </video>

If you don't specify the dimensions at all, the video will display at its original size.