(HTML & CSS) Can I set an iframe to fill all available space? **Resolved** [Archive]

PDA

Click to See Complete Forum and Search --> : (HTML & CSS) Can I set an iframe to fill all available space? **Resolved**

msimmons

Nov 1st, 2002, 11:52 AM

Can I set an iframe to fill all available space? Like height="*"?
Michael

The Hobo

Nov 1st, 2002, 12:52 PM

I don't know how well supported it is, but in IE6, this works:

<iframe style="height: 100%; width: 100%;"></iframe>

msimmons

Nov 1st, 2002, 01:28 PM

Does that tell it to be 100% of the container (in this case the page) or to fill the available space? I think it is the first one cos its going off the page now.

msimmons

Nov 4th, 2002, 11:30 AM

The Hobo

Nov 4th, 2002, 12:01 PM

It doesn't go off the page for me, man. Do you have it nested in another tag, like a <div>?

msimmons

Nov 4th, 2002, 02:40 PM

No but I have something above it. This code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<BODY>
<img src="filler" height="50">
<iframe style="height: 100%; width: 100%;"></iframe>
</BODY>
</HTML>

will give it exactly 50px of scroll bar.

The Hobo

Nov 4th, 2002, 02:45 PM

oh. damn :(

msimmons

Nov 4th, 2002, 03:04 PM

yup :(
I did workaround the problem with the page i was having this time but would like to know in the future so I can get away from framsets

punkpie_uk

Nov 5th, 2002, 03:32 AM

have you tried nesting it in a div and setting width and height to 100%?

Also, replace <img src="filler" height="50"> with a div, it should speed up rendering. <div style="width:100%; height:50%;">

msimmons

Nov 5th, 2002, 08:53 AM

nesting didn't work :)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<BODY>
<img src="filler" height="50">
<div style="height: 100%; width: 100%;">
<iframe style="height: 100%; width: 100%;"></iframe>
</div>
</BODY>
</HTML>

Sorry to be dense but I don't understand what you mean about the image.

punkpie_uk

Nov 5th, 2002, 09:02 AM

Try this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> New Document </TITLE>
</HEAD>
<BODY>
<div style="height: 100%; width: 100%;">
<div style="height:50%; width:100%;"></div>
<iframe style="height: 50%; width: 100%;"></iframe>
</div>
</BODY>
</HTML>

msimmons

Nov 5th, 2002, 09:10 AM

that dosen't give scrollbars because the totals equal 100%. The situation I have is that the page is completely dynamic based on querystring perameters [sic]. The way it is now is, sometimes I have a graphic heading (different ones of different sizes) and sometimes not, then a frame that is a fixed size, then a frame that I need as big as possible but I never know how much room I have. thats why I am using frames now cos of the "*" feature but it still isn't what I want.
thanks
Michael

jamieoboth

Dec 14th, 2002, 02:29 PM

umm.m... dont use 'style'. I dont.

Just use <Iframe src="whatever" width="100%" height="100%">

lol works ok on my site, Mike. You just helped me with it :)

James

msimmons

Dec 16th, 2002, 09:42 AM

Originally posted by jamieoboth
umm.m... dont use 'style'. I dont.

Just use <Iframe src="whatever" width="100%" height="100%">

lol works ok on my site, Mike. You just helped me with it :)

James
Still doesn't work.

The Hobo

Dec 16th, 2002, 11:30 AM

Originally posted by jamieoboth
umm.m... dont use 'style'. I dont.

Just because you practice bad coding standards doesn't mean that others should as well. Try running that code through a validator and see what happens.

jamieoboth

Dec 16th, 2002, 12:10 PM

lol fine. It was just a suggestion mate... jesus....

wpearsall

Dec 16th, 2002, 02:23 PM

try using the following code in your <body> tag:

topmargin="0" leftmargin="0" rightmargin="0" marginwidth="0" marginheight="0"

it will stop IE adding its margin to the page :)
and hopefully make the width & height propa

msimmons

Dec 16th, 2002, 02:25 PM

still wont work :)

The Hobo

Dec 16th, 2002, 04:47 PM

Originally posted by jamieoboth
lol fine. It was just a suggestion mate... jesus....

No need to bring religion into this.

Would you tell a man building a house to use Elmer's Glue when he can't find nails? If you're a lunatic, maybe. So don't tell someone to use bad coding practices either. :)

The Hobo

Dec 16th, 2002, 04:56 PM

You probably don't want tables as your answer, but I think this is valid HTML. I've only tried it in IE 5.5, though:

<html>
<head>
<title>blah</title>
</head>
<body>
<table style="border: 1px solid black; width: 100%; height: 100%;">
<tr>
<td><img src="filler" height="120"></td>
</tr>
<tr>
<td style="height: 100%;">
<iframe src="blah" style="width: 100%; height: 100%;"></iframe>
</td>
</tr>
</table>
</body>
</html>

msimmons

Dec 16th, 2002, 05:21 PM

Originally posted by The Hobo
You probably don't want tables as your answer...
Whatever works... and that worked :) Thanks!

wpearsall

Dec 17th, 2002, 03:07 AM

nuva idea:

I checked my site on an html validator, and topmargin="0" etc, wasn't HTML 4.01 Traditional "Valid"

So i changed it to:

<body style="margin: 0px;">

and dats Valid HTML,

So try that :)

Like:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>This is my page title</title>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; charset=ISO-8859-1">
</head>
<body style="margin: 0px;">

<iframe frameborder="0" style="width:100%; height:100%;" src="myPage.html" name="CommentsFrame"></iframe>

</body>
</html>

Note: This is the way it shud b set out, u can add more Meta Tag's etc, but u shud really have the content-type 1 and the DOCTYPE header :)

jamieoboth

Dec 17th, 2002, 07:27 AM

Originally posted by The Hobo
No need to bring religion into this.

Would you tell a man building a house to use Elmer's Glue when he can't find nails? If you're a lunatic, maybe.

Yes. And yes. Look at the smiling face. Theres no way it could be THAT happy without something being wrong.... Elmers glue? :|

Try no more nails. lol....

The Hobo

Dec 17th, 2002, 01:20 PM

Originally posted by jamieoboth
Yes. And yes. Look at the smiling face. Theres no way it could be THAT happy without something being wrong.... Elmers glue? :|

Try no more nails. lol....

Try posting after you've sobered up. You'll make more sense that way.

Zach Elfers

Dec 27th, 2002, 10:32 PM

You could also do:

<html>
<head>
<title>Title</title>
</head>
<body style="margin:0px;">
<div style="height:100%;width:100%;">
<img src="filler.ext" height="50">
<div style="height:100%;width:100%;">
<iframe width="100%" height="100%">
</div>
</div>
</body>
</html>

That will probably work.

msimmons

Dec 28th, 2002, 11:28 AM

Originally posted by Zach Elfers
You could also do:

<html>
<head>
<title>Title</title>
</head>
<body style="margin:0px;">
<div style="height:100%;width:100%;">
<img src="filler.ext" height="50">
<div style="height:100%;width:100%;">
<iframe width="100%" height="100%">
</div>
</div>
</body>
</html>

That will probably work.
nope :)