Unsupported html css handling question

HTML & CSS
1

Good afternoon,

I have a html5 video tag. I am putting an img tag inside it as alt content. The only way a browser shows the img instead of the video is if it is too old to understand the video tag. So am I to assume that using this css…

video img {…}

Would not work since it doesn’t understand video tag? Or because it doesn’t understand it it skips over it and just sees the “img” in the css? Or does the browser understanding of html and css not run parallel so there is no known answer?

For the time being I just used a class on it because I didnt know the answer.

2

In regards to the CSS in that case I’m pretty sure it would stop reading at the parent selector (video) and would not read anything further. So it would not ignore video and then read img.

Have you read through the video fallback examples at MDN?

<!-- Using multiple sources as fallbacks for a video tag -->
3

From what I can see, unless you’re wanting to support Opera Mini, it isn’t the <video> element or CSS that is a major concern, but rather having supported video formats.* i.e.

  • WebM video format
  • MPEG-4/H.264 video format
  • Ogg/Theora video format
  • WebVTT - Web Video Text Tracks
  • HEVC/H.265 video format

* a reason many don’t host different formats of videos themselves but host them at youtube or elsewhere that handles serving the needed supported format automatically

2 Likes
4

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.