WordPress.org

Ready to get started?Download WordPress

Forums

Trying to add responsive to an iframe embedded into a page (Cross domain) (1 post)

  1. halben
    Member
    Posted 9 months ago #

    NOTE: The embedded iframe is a contact form.

    I am trying to make the embedded iframe responsive in a contact page. This would be a cross browser iframe.

    What I did was I went to edit page, inserted the iframe code:

    <div id="embed-container">
    <iframe src="http://other-domain.com/contact-us.html" height="650" width="500" frameborder="0" scrolling="no"></iframe>
    </div>

    CSS:

    #embed-container {
    	border: 1px dashed red;
    	position: relative;
    	padding-bottom: 65.25%;
    	padding-top: 30px;
    	height: 0;
    	overflow: hidden;
    }
    #embed-container iframe, #embed-container object, #embed-container embed {
    	position: absolute;
    	top: 0;
    	left: 0;
    	width: 100%;
    	height: 100%;
    }

    The container is responsive but the iframe is not. Have any one done this before? If so, can you please assist me?

    Thanks,
    Hal

Reply

You must log in to post.

About this Topic