Youtube iframes sitting on top of fixed position element in Chrome

Question

In chrome youtube iframes float on top of my fixed position header. I've tried setting z-indexes for both and its not happening.

Anybody know a fix for this?

Answer 1

When you embed a youtube iframe like this:

<iframe width="560" height="315" src="http://www.youtube.com/embed/FSHDDteCBXw" frameborder="0" allowfullscreen></iframe>

The default wmode will make the video overlay everything else, the solution is just add ?wmode=opaque in to the end of the src="http://www.youtube.com/embed/FSHDDteCBXw"

like this:

<iframe width="560" height="315" src="http://www.youtube.com/embed/FSHDDteCBXw?wmode=opaque" frameborder="0" allowfullscreen></iframe>