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>