Solved

iframe dynamic sizing problem

Posted on 2013-05-24
10
268 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
 
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
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 
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

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Suggested Solutions

Title # Comments Views Activity
Synchronizing CSS load 3 29
Bad <form> statement? 9 25
Bootstrap on PLNKR 3 14
Put shading on half of picture 8 23
"In order to have an organized way for empathy mapping, we rely on a psychological model and trying to model it in a simple way, so we will split the board to three section for each persona and a scenario and try to see what those personas would Do,…
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn how to dynamically set the form action using jQuery.
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…

910 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

Need Help in Real-Time?

Connect with top rated Experts

24 Experts available now in Live!

Get 1:1 Help Now