A better way to have a responsive iframe using beaver builder....

So I have done this post already but I have found a better way…

Add this html:
Example is google maps:

.googlymaps {
position: relative;
padding-bottom: 40%; // Change this value to change visible height of iframe
height: 0;
overflow: hidden;
.googlymaps iframe {
position: absolute;
top: 0;
left: 0;
width: 100% !important;
height: 100% !important;

<div class=“googlymaps”>
<iframe src=“https://www.google.com/maps/d/embed?mid=xxxxxxxxxxxxxxxxxx&z=10” width=“100%” height=“400” frameborder=“0” style=“border:0”></iframe>

Thanks Adam!