Solved

iframe dynamic sizing problem

Posted on 2013-05-24
10
275 Views
Last Modified: 2013-06-06
Folks, you can view my problem here my issue is this, inside the red area on the left (this I need to dynamically take up all width and height, it appears fine width wise just the height is a problem ) inside this area is an iFrame. When you choose a document from that first chapter it links to a pdf which I need to take up the red area..

Can ANYONE shed any light on my problem why its not working ? I can see the wood for the trees anymore ??

Thanks for reading

PS.. I inherited this site so I am aware I would have done this totally different if Id designed from scratch..
0
Comment
Question by:mrmad1966
  • 5
  • 2
  • 2
  • +1
10 Comments
 
LVL 9

Expert Comment

by:TvMpt
ID: 39193597
<iframe id="myFrame" style="visibility: visible; width: 100%; height: 100%;" src="LinkedDocuments/Operational.pdf">

seems to work fine...
0
 
LVL 1

Author Comment

by:mrmad1966
ID: 39194172
Not for me !
0
 
LVL 9

Expert Comment

by:TvMpt
ID: 39194179
Im using firefox. In wich browser are you testing?
0
Resolve Critical IT Incidents Fast

If your data, services or processes become compromised, your organization can suffer damage in just minutes and how fast you communicate during a major IT incident is everything. Learn how to immediately identify incidents & best practices to resolve them quickly and effectively.

 
LVL 1

Author Comment

by:mrmad1966
ID: 39194264
Chrome & IE.. Sadly its IE our organisation uses :-(
0
 
LVL 1

Author Comment

by:mrmad1966
ID: 39194348
If I change the units to px instead of % it works... Why can I not use % and how could I  ?
0
 
LVL 53

Accepted Solution

by:
COBOLdinosaur earned 500 total points
ID: 39194513
Design issues are not your biggest problem.  The page needs to be validated.  There are structural errors an mis-tagging around the iframe element.  the fact that you have the iframe inside a table very much limits what you can do with it.  If you tweak the design to move the iframe out of the table then you will have an independent element that will allow more precise control.

Finally you are using an obsolete doctype and rendering to the HTML4 specification introduces issues with percentage heights, especially when there are dynamic effects involved.

Cd&
0
 
LVL 1

Author Comment

by:mrmad1966
ID: 39194529
Thanks for that... This it seems was originally auto generated code from some software program.. I think Im leaning towards starting from scratch..
0
 
LVL 53

Assisted Solution

by:COBOLdinosaur
COBOLdinosaur earned 500 total points
ID: 39194949
If it was me.  I would re-write.  It is not a complex layout, and the 20th century code has basically seen better days. The big advantage of a re-write is you will have something more robust and easier to maintain going forward.

Cd&
0
 
LVL 1

Author Comment

by:mrmad1966
ID: 39195014
food for thought, thank you
0
 
LVL 15

Expert Comment

by:Jagadishwor Dulal
ID: 39196243
Your main problem is bodyColumn td it's set to 75% that means your iframe 100% is 75% of that td.
0

Featured Post

Free Tool: IP Lookup

Get more info about an IP address or domain name, such as organization, abuse contacts and geolocation.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
Intranet Site for Medical Practice 7 51
Sending ASP to server side 8 31
Html split(text) 2 28
How to add custom html-5 element to a dynamically generated link? 4 23
This article explains how to prepare an HTML email signature template file containing dynamic placeholders for users' Azure AD data. Furthermore, it explains how to use this file to remotely set up a department-wide email signature policy in Office …
FAQ pages provide a simple way for you to supply and for customers to find answers to the most common questions about your company. Here are six reasons why your company website should have a FAQ page
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
HTML5 has deprecated a few of the older ways of showing media as well as offering up a new way to create games and animations. Audio, video, and canvas are just a few of the adjustments made between XHTML and HTML5. As we learned in our last micr…

756 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