1. Design System
  2. Components
  3. Embedded content

Embedded content

YouTube video

<div class="flex-video"> 
    <iframe width="640" height="360" title="A to Z of Brookes" src="https://www.youtube-nocookie.com/embed/X_WhDt18-2E?controls=0" frameborder="0" allowfullscreen></iframe>
</div>

Usage

Wrap the element in a div with the class flex-video.

Accessibility

There is no way to guarantee the accessibility of third party embedded content.

The best way is to create accessible content or link out to the third party website.

Always provide a title attribute to the iframe.

Use descriptive titles and captions for your videos. If your video contains critical information, provide a transcript too.

Add your own subtitles & closed captions to YouTube videos.