Avadhoot Dandekar

Responsive Google Slides

Use the following code to embed a responsive Google Slides presentation in your blogs. You can also use the same code for other iframes to make it responsive in your Blogger blog posts.

<style>
.responsive {
position: relative;
padding-bottom: 56.25%;
padding-top: 35px;
height: 0;
overflow: hidden;
}
.responsive iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
</style>  
<div class="responsive" style="text-align: center;">
<iframe allowfullscreen="true" frameborder="0" height="569" mozallowfullscreen="true" src="https://docs.google.com/presentation/d/19XXhOg8h5x-4bW1tCmp5NZLaGOA_0JpiqF0OZZE0Iok/embed?start=false&loop=false&delayms=3000" webkitallowfullscreen="true" width="960"></iframe>
</div>

You can see the working code in the Codepen.

See the Pen Responsive Google Presentation by Avadhoot Dandekar (@AvadhootDandekar) on CodePen.

Follow Channel

Follow Channel