Solved

Ask iframe to use entire area

Posted on 2014-07-25
11
244 Views
Last Modified: 2014-07-26
Here is the actual page.  Here is a video showing a visual of the trouble I am having http://screencast.com/t/zjXoRWfkmR31 and the iframe syntax is below.  Assistance is greatly appreciated.
<iframe src="https://docs.google.com/forms/d/138XZwm17GPB8Gy0zbsUNV-eQFPa7_o_7pbHzrE7Ho0k/viewform?embedded=true" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="100%" width="100%">Loading...</iframe>

Open in new window

0
Comment
Question by:frugalmule
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 5
  • 5
11 Comments
 
LVL 13

Expert Comment

by:duncanb7
ID: 40221016
You need to set iframe parent node to fix width and height,
width=100% is inherited from his parent node, try this for exmaple
 such as body or div tag
<body style="width:1000px; height:1000px">
<iframe src="https://docs.google.com/forms/d/138XZwm17GPB8Gy0zbsUNV-eQFPa7_o_7pbHzrE7Ho0k/viewform?embedded=true" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="100%" width="100%">Loading...</iframe>
</body>

Open in new window


Duncan
0
 

Author Comment

by:frugalmule
ID: 40221019
Very interesting.  body style gets stripped from the syntax by default?
0
 
LVL 13

Expert Comment

by:duncanb7
ID: 40221020
body style gets stripped from the syntax by default?

What is that mean ? Pleae write it in detail

set the width and height for your wrapper tag to iframe if
you want to use width="100%"

I tested it works at my side

Duncan
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 

Author Comment

by:frugalmule
ID: 40221027
Here is my attempt in detail http://screencast.com/t/XHXu0VCdfZK2
0
 
LVL 13

Expert Comment

by:duncanb7
ID: 40221032
you question is "Ask iframe to use entire area"

Could you send us your actul page at http://frugalmule.com/payreq/ ?

Otherwise, it is hard to understand what you want

Duncan
0
 

Author Comment

by:frugalmule
ID: 40221035
Now I am not sure what you mean?
It is a wordpress page.
Here is a detailed video showing what is happening http://screencast.com/t/XHXu0VCdfZK2.

Here is the page www.frugalmule.com/payreq.
0
 
LVL 13

Expert Comment

by:duncanb7
ID: 40221038
Could you send  the index.php to us at
http://frugalmule.com/payreq/index.php ?
Your issue the iframe is that site could not get entire page Right ?


Duncan
0
 

Author Comment

by:frugalmule
ID: 40221049
Thank you for looking.

Here is a screenshot of it also in notepad ++  http://screencast.com/t/oIBwMq0w1utz
index.php.txt
0
 
LVL 13

Accepted Solution

by:
duncanb7 earned 500 total points
ID: 40221052
Since it is controlled by wordpress,  

You can try this to set any width and heigh you want  in the following examples

Duncan

Example-1
<div style="width:1000px; height:1000px">
<iframe src="https://docs.google.com/forms/d/138XZwm17GPB8Gy0zbsUNV-eQFPa7_o_7pbHzrE7Ho0k/viewform?embedded=true" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="100%" width="100%">Loading...</iframe>
</div>

Open in new window


Or you can do
Example-2
<iframe src="https://docs.google.com/forms/d/138XZwm17GPB8Gy0zbsUNV-eQFPa7_o_7pbHzrE7Ho0k/viewform?embedded=true" marginwidth="0" marginheight="0" scrolling="no" frameborder="0" height="1000px" width="1000px">Loading...</iframe>

Open in new window

0
 
LVL 58

Expert Comment

by:Gary
ID: 40221482
Add this CSS

#main-content, #main-content article,#main-content div {
    height: 100%;
}

Open in new window

0
 

Author Closing Comment

by:frugalmule
ID: 40221655
I tried example two and it worked.  It turns out it was the percentage it didn't like and I did not catch the 1000px thing which worked very well.
0

Featured Post

Don't Cry: How Liquid Web is Ensuring Security

WannaCry is just the start. Read how Liquid Web is protecting itself and its customers against new threats.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Use these top 10 tips to master the art of email signature design. Create an email signature design that will easily wow recipients, promote your brand and highlight your professionalism.
Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The purpose of this video is to demonstrate how to reset a WordPress password if you are locked out and cannot reset the password. A typical use would be if you cannot access the email to which WordPress would send the password recovery email to…
The purpose of this video is to demonstrate how to update a WordPress Site’s version. WordPress releases new versions of its software frequently and it is important to update frequently in order to keep your site secure, and to get new WordPress…

696 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question