CODEWITHSUNDEEP
csshtmlvideocross-browserbackground-color
Laust Deleuran
Laust Deleuran

Reputation: 490

What devices / browsers support the background-color attribute on the <video> element?

It seems that a range of browsers (some device specific) don't support the background-color property. I've created an isolated test here:

http://jsfiddle.net/laustdeleuran/u7WBq/

So far, it seems that IE9 and IE10 doesn't adhere to this property, while Chrome, FF, Opera and Safari (all on PC) do. I'm updating the fiddle as I test.

In some test cases, I do see a quick flash of the red background color on IE10, before the video renders. But the video then renders with black over the red background color, which I'm guessing is probably due to the whole area being hardware accelerated.

This post on a Metro HTML5 app might be related as well as this post on background-color on videos on iPad.

Upvotes: 1

Views: 217

Answers (1)

Ecropolis
Ecropolis

Reputation: 2025

I suggest wrapping your <video> element in a <div>. Do your styling on the outer div wrapper and set the width and height of the video element to inherit.

Upvotes: 0

Related Questions