473,287 Members | 1,708 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,287 software developers and data experts.

iframe width cannot be controled ?

hi guys,

I am trying to make some iframes fit into a div with variable width. The iframe must have a margin, and using a padding in the parent div element is not an option.

Unfortunately, the width:auto for iframe gives a preset width, and does not behave like for the div elements.

As a result, the iframe always seem to resize its container.

See the testcases below :

This is how it behaves when a div contains a div with width:auto > that's the result I want to achieve with an iframe
<div style="width:100px;background-color:blue">Container<div style="width:auto;margin:10px;background-color:white">content</div></div>

This is how it behaves when a div contains an iframe with width:auto
<div style="width:100px;background-color:red">Container<iframe style="width:auto;margin:10px" src=""></iframe></div>

This is how it behaves when a div contains an iframe with width:100% (the container becomes too big)
<div style="width:100px;background-color:red">Container<iframe style="width:100%;margin:10px" src=""></iframe></div>


Any ideas ?
Thanks,

Yohann
Jul 2 '08 #1
2 4408
dlite922
1,584 Expert 1GB
may I ask why you need to use iFrame? maybe there's a different solution?

-Dan
Jul 6 '08 #2
hsriat
1,654 Expert 1GB
I tried, but could not get a CSS solution.

You may find this useful:
Expand|Select|Wrap|Line Numbers
  1. window.onload = function () {
  2.     var ifm = document.getElementsByTagName('iframe')[0];
  3.     ifm.style.width = ifm.parentNode.style.width;
  4. }
Jul 7 '08 #3

Sign in to post your reply or Sign up for a free account.

Similar topics

2
by: Sticky | last post by:
I really need some help - i have already pulled out 1/2 my hear and the rest is following quickly..... I am designing a page containing an iFrame, the contents of which are selected dynamically...
3
by: Greg | last post by:
Javascript Folks, I am relatively new to javascript and am working on a script where I want to utilizes a couple of iframes and format text in them. I have run into a problem with getting the...
0
by: Martin | last post by:
I understand that as of IE5.5 iframes respect the z-index style property. However I have noticed some odd behaviour when the iframe's src is set to an MHT web archive instead of an HTML file. ...
1
by: jaktharkhan | last post by:
Hi, I really really need help in trying to figure out how can I do a CloneNode on an Iframe where the cloned IFRAME clones with all its contents?. Basically what I am doing is dynamically building...
8
by: hyejin | last post by:
I have a problem with dynamic iframe and document.close() on Firefox. Below two files create a dynamic iframe by JavaScript. These two samples do not have any problems on IE. But, on Firefox, the...
5
by: brad | last post by:
I'll post my code below. My goal is to grab the selected text in an iFrame from javascript (really any way possible). When I highlight text in the iFrame and click the link outside of the iFrame, I...
7
by: pb | last post by:
Hi all, I have some code that automatically generates a url depending on user selections. This url is then set as a hyperlink and the user clicks on the link that has the target as an iframe on...
0
by: tequilamala | last post by:
I have an Iframe in one of the pages i am developing... the iframe is suppose to scroll up and down and the links target the iframe. the problem is that the iframe scrolls side to side on internet...
2
by: olddocks | last post by:
i am planning on kind of editor by replacing the textarea with iframe so that i could edit the content with rich html. I am facing weird problem and i cannot set the value of iframe innerHTML with...
2
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 7 Feb 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:30 (7.30PM). In this month's session, the creator of the excellent VBE...
0
by: DolphinDB | last post by:
The formulas of 101 quantitative trading alphas used by WorldQuant were presented in the paper 101 Formulaic Alphas. However, some formulas are complex, leading to challenges in calculation. Take...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
by: Aftab Ahmad | last post by:
Hello Experts! I have written a code in MS Access for a cmd called "WhatsApp Message" to open WhatsApp using that very code but the problem is that it gives a popup message everytime I clicked on...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
1
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: jfyes | last post by:
As a hardware engineer, after seeing that CEIWEI recently released a new tool for Modbus RTU Over TCP/UDP filtering and monitoring, I actively went to its official website to take a look. It turned...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.