Skip to main content

Dimensions

Outer container​

Height​

HTML​

<o-embed url="https://youtu.be/FTQbiNvZqaY" height="300"></o-embed>

Width​

HTML​

<o-embed url="https://youtu.be/FTQbiNvZqaY" width="300"></o-embed>

Width and height​

HTML​

<o-embed url="https://youtu.be/FTQbiNvZqaY" width="300" height="300"></o-embed>

Inner <iframe>​

Optional, Custom CSS Properties were added in @social-embed/wc at 0.0.3-next.0:

  • --social-embed-iframe-height
  • --social-embed-iframe-width

Height​

HTML​

<style>
  o-embed.full {
    --social-embed-iframe-height: 100%;
    --social-embed-iframe-width: 100%;
    height: 500px;
  }
</style>
<o-embed url="https://youtu.be/FTQbiNvZqaY" class="full"></o-embed>

Height + width​

<style>
  o-embed.full {
    --social-embed-iframe-height: 100%;
    --social-embed-iframe-width: 100%;
    height: 300px;
    width: 500px;
  }
</style>
<o-embed url="https://youtu.be/FTQbiNvZqaY" class="full"></o-embed>