# Viewport?

**URL:** <https://discuss.write.as/t/viewport/2595>\
**Category:** Customization\
**Created:** [March 12, 2021, 4:19pm UTC](https://discuss.write.as/t/viewport/2595 "2021-03-12T16:19:16Z")\
**Posts on this page:** 1\
**Showing post:** 4

<div class="post-metadata">

**Author:** ![dino](https://discuss.write.as/user_avatar/discuss.write.as/dino/32/645_2.png) [@dino](https://discuss.write.as/u/dino)\
**Post date:** [March 16, 2021, 6:20pm UTC](https://discuss.write.as/t/viewport/2595/4 "2021-03-16T18:20:13Z")

</div>

Below is the custom CSS I use on my site to handle video embeds. To use it, you have to wrap the embed script with a `div` element, like this: `<div class="video-container">embed script goes here</div>`. More instructions [here](https://journal.dinobansigan.com/how-to-embed-responsive-youtube-videos-on-write-as).

What kind of video are you trying to embed? I ask because Write.as recently added support for [rich media embeds](https://discuss.write.as/t/rich-media-embeds/2425). All you have to do, for say a youtube video, is to paste the link to the video, and it will automatically be rendered in a responsive design on a page.

```css
/* Responsive Video Container */
#post-body .video-container {
    margin-bottom: -20px;
}

.video-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px; height: 0; overflow: hidden;
}
 
.video-container iframe,
.video-container object,
.video-container embed {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

```

---

_[View the full topic](https://discuss.write.as/t/viewport/2595)._