# Responsive vimeo video not working

**URL:** <https://community.hubspot.com/t/responsive-vimeo-video-not-working/9069>\
**Category:** CMS Development\
**Created:** [June 6, 2018, 12:42pm UTC](https://community.hubspot.com/t/responsive-vimeo-video-not-working/9069 "2018-06-06T12:42:03Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![AllisonAltus](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/allisonaltus/32/58551_2.png) [@AllisonAltus](https://community.hubspot.com/u/AllisonAltus)\
**Post date:** [June 6, 2018, 12:42pm UTC](https://community.hubspot.com/t/responsive-vimeo-video-not-working/9069/1 "2018-06-06T12:42:03Z")

</div>

hi i’m trying to embed a video from vimeo that’s responsive for mobile but when i copy the embed code it pulls in 56% padding? so there’s odd spacing at the top of the page - why does it do this? here is the code:

\<div style=“padding:56.25% 0 0 0;position:relative;”\>\<iframe src=“[Private Video on Vimeo](https://player.vimeo.com/video/268380757?title=0&byline=0&portrait=0)” style=“position:absolute;top:0;left:0;width:100%;height:100%;” frameborder=“0” webkitallowfullscreen mozallowfullscreen allowfullscreen\>\</iframe\>\</div\>\<script src="[https://player.vimeo.com/api/player.js"\>\</script](https://community.hubspot.com/)\>

Then how do i define the size that i want it on the page? But still keep it responsive?

Thanks

Allison

---

<div class="post-metadata">

**Author:** ![jonchim](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jonchim/32/88818_2.png) [@jonchim](https://community.hubspot.com/u/jonchim)\
**Post date:** [June 6, 2018, 1:56pm UTC](https://community.hubspot.com/t/responsive-vimeo-video-not-working/9069/2 "2018-06-06T13:56:35Z")

</div>

Hi Allison try using this code below,

paste the css styles in your .css file and then all you need is the code in the div class embed container

```auto
.embed-container { 
position: relative; 
padding-bottom: 56.25%; 
height: 0; 
overflow: hidden; 
max-width: 100%; 
} 

.embed-container iframe, .embed-container object, .embed-container embed { 
position: absolute; 
top: 0; 
left: 0; 
width: 100%; 
height: 100%; 
}

<div class='embed-container'><iframe src='https://player.vimeo.com/video/268380757' frameborder='0' webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe></div>

```

---

<div class="post-metadata">

**Author:** ![KateBeebe](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/katebeebe/32/58667_2.png) [@KateBeebe](https://community.hubspot.com/u/KateBeebe)\
**Post date:** [April 11, 2019, 6:43pm UTC](https://community.hubspot.com/t/responsive-vimeo-video-not-working/9069/3 "2019-04-11T18:43:28Z")

</div>

YES! Worked for us. Thanks so much, @jonchim!!