Bootstrap responsive iframe You can use bootstrap inbuilt classes to make responsive iframe, Here in this article we are going to explain how you can make responsive iframes.
Bootstrap responsive iframe Css Class Example
Wrap iframe with div wrapper and add class esponsive-embed. Here is an example of responsive iframe-
Bootstrap responsive iframe | Example:
<!-- 4:3 aspect ratio --> <div class="embed-responsive embed-responsive-4by3"> <amp-iframe class="embed-responsive-item" src="your url" sandbox="allow-scripts allow-same-origin" height="400" layout="fixed-height"><div placeholder="" class="amp-wp-iframe-placeholder"></div></amp-iframe> </div> <!-- 16:9 aspect ratio --> <div class="embed-responsive embed-responsive-16by9"> <amp-iframe class="embed-responsive-item" src="your url" sandbox="allow-scripts allow-same-origin" height="400" layout="fixed-height"><div placeholder="" class="amp-wp-iframe-placeholder"></div></amp-iframe> </div> |
You can add the aspect ratio as above.