# How do we configure default height for codepen embeds?

**URL:** <https://meta.discourse.org/t/how-do-we-configure-default-height-for-codepen-embeds/175407>\
**Category:** Support\
**Created:** [January 7, 2021, 6:38pm UTC](https://meta.discourse.org/t/how-do-we-configure-default-height-for-codepen-embeds/175407 "2021-01-07T18:38:26Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)\
**Post date:** [January 7, 2021, 6:38pm UTC](https://meta.discourse.org/t/how-do-we-configure-default-height-for-codepen-embeds/175407/1 "2021-01-07T18:38:27Z")

</div>

Here’s an example, which will have a default height:

https://codepen.io/trusktr/embed/preview/rNMdamE?default-tabs=js%2Cresult&height=300&host=https%3A%2F%2Fcodepen.io&slug-hash=rNMdamE

It has a default height. Can we configure the default height somewhere?

---

<div class="post-metadata">

**Author:** ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)\
**Post date:** [January 7, 2021, 7:40pm UTC](https://meta.discourse.org/t/how-do-we-configure-default-height-for-codepen-embeds/175407/2 "2021-01-07T19:40:49Z")

</div>

I think it’s set directly in the iframe on Codepen’s end? either way you can add some CSS to your site (admin \> customize \> themes) to override it:

```css
.cp_embed_iframe {
    height: 500px;
}

```

---

<div class="post-metadata">

**Author:** ![trusktr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/trusktr/32/116841_2.png) [@trusktr](https://meta.discourse.org/u/trusktr)\
**Post date:** [January 7, 2021, 8:42pm UTC](https://meta.discourse.org/t/how-do-we-configure-default-height-for-codepen-embeds/175407/3 "2021-01-07T20:42:42Z")

</div>

> [@awesomerobot](#):
>
> I think it’s set directly in the iframe on Codepen’s end?

That’s true, but we would have to do that with every post.

> [@awesomerobot](#):
>
> you can add some CSS

That does the trick. Thanks!

---

<div class="post-metadata">

**Author:** ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)\
**Post date:** [February 6, 2021, 8:42pm UTC](https://meta.discourse.org/t/how-do-we-configure-default-height-for-codepen-embeds/175407/4 "2021-02-06T20:42:48Z")

</div>

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