In my 6 slides, I go from changing one thing in the html to changing/adding multiple things. Basically, you can get rid of the Google bottom toolbar, get rid of black sides on a Google Canvas embed, and/or remove black top/bottom (keeping or removing toolbar) on a short wide slide. This tutorial shows (in layman's terms) how to CROP your Google Embed in Canvas. This may not be the shortest workaround, but it's the simplest to add/adapt for those who don't really care about or want to care about html. I added more advanced info for those who know some html or understand it (or want to understand it) The green text explains what html does in each case-if you want to know. So, I made this mainly for those who DO NOT understand/like/care about html code. Whereas, most of us can handle dealing with numbers that equate to length and width. How I Chose These Fixes To me, the &rm=minimal is confusing because it doesn't equate with any real life stuff I know. If you want to know my reasoning and process, read on, otherwise, just click the tutorial and dive in! I used some different methods than the rm minimal to make it easier to understand for non-coders. The link to my Google Slides Tutorial is here and at the bottom. I decided to make a tutorial to help fix all these things. TUTORIAL & GUIDE: I DON'T KNOW HTML but I Want to Make Google Embeds Pretty in Canvas
![html iframe code crop html iframe code crop](https://premio.io/wp-content/uploads/2020/10/Screenshot-2020-10-26-at-16.27.26.png)
And it even appears well on the mobile screen. You'll still get black bars on the sides, because of the google slide dimensions itself, but it's better than the ever increasing black border on the top and bottom. Try out the code on a separate page and resize your screen to see the magic. This trick makes is so that the DIV container recalculates itself based on the size of the screen while the IFRAME expands to fill the available size of the DIV. If you change the width and height dimensions in the IFRAME, be sure to recalculate the ratio for the padding-bottom in the surrounding DIV.
![html iframe code crop html iframe code crop](https://www.w3schools.blog/wp-content/uploads/2019/10/Pasted-into-.png)
I used the size dimensions in your code to figure out the ratio: 569 / 960 * 100 = 59.27% and I also converted the CSS code into an inline style for you: What you need is a responsive embed! Check out and you can plug in your code under generic iframe. Looking at your code, I take it that's what you got from Google when you click Publish to Web? And you're trying to get rid of the black bars on the top and bottom when the size of the browser window changes, right?