PDA

View Full Version : Auto resize frames


kidzer
03-27-2004, 08:55 PM
Is there a piece of HTML that wil automatically resize frames for the size of monitor, my website was designed and made on a 17Inch monitor for Ryan Sharp, if you have a different sized monitor, visit and see for yourself what i mean,

Thanks in advance

David, 14

kidzer
03-27-2004, 09:31 PM
That is the code i'm using for my frames page, is there anything blatantly obvious that i could change to make it resize itself for different moitor sizes? Or can it not be done?

:cool:

<html>
<head>
<meta name="Author" content="David Milne 2004">
<meta name="Description" content="Ryan Sharp is an Aberdeenshire based racing driver with a bright future ahead of him">
<meta name="KeyWords" content="Motor Racing, Mostorsport, Norco, Formula One, Ryan Sharp">
<title>Ryan Sharp -- 2003 German Formula Renault Champion</title></head>
<body bgcolor="#000000">

<span style="position: absolute; left: 169; top: 8">
<iframe src="topframe.html" name=title width=825 height=135 scrolling=NO frameborder=0></iframe></span>

<span style="position: absolute; left: 0; top: 8">
<iframe src="leftframe.html" name=menu width=200 height=550 scrolling=NO
frameborder=0></iframe></span>

<span style="position: absolute; left: 260; top: 158">
<iframe src="maincontent.html" name=main width=850 height=500 scrolling=auto frameborder=0></iframe></span>

</body>
</html>

DesignersToolz
03-27-2004, 09:37 PM
Use percentages instead of absolute values?

kidzer
03-27-2004, 09:59 PM
So would that make the Frame sizes a percentage of the total screen size?

And don't mean to sound lazy but...what bits would i change? and how?


Thanks very very very much

David, 14

DesignersToolz
03-27-2004, 10:07 PM
It would resize the frames to the page when it was loaded and resized.

To accomplish this you would changed all the absolute values to percentages.

Example:



<span style="position: absolute; left: 20%; top: 3%">
<iframe src="topframe.html" name=title width=90% height=20% scrolling=NO frameborder=0></iframe></span>


What you will have to do is play around with the percentage values until the page looks like it should. Then your good to go.

DesignersToolz
03-27-2004, 10:07 PM
BTW, thought I might add; this layout system is know as a "liquid layout".

Afrow UK
03-27-2004, 10:09 PM
I'm no good at doing columns with divs, so I'll use tables instead:

<html>
<head>
<meta name="Author" content="David Milne 2004">
<meta name="Description" content="Ryan Sharp is an Aberdeenshire based racing driver with a bright future ahead of him">
<meta name="KeyWords" content="Motor Racing, Mostorsport, Norco, Formula One, Ryan Sharp">
<title>Ryan Sharp -- 2003 German Formula Renault Champion</title></head>
<body bgcolor="#000000">

<table style="border: 0px"><tr><td colspan="2">

<iframe src="topframe.html" name=title width=100% height=135 scrolling=NO frameborder=0></iframe>

</td></tr>
<tr><td style="width: 220px">

<iframe src="leftframe.html" name=menu width=200 height=550 scrolling=NO
frameborder=0></iframe>

</td><td>

<iframe src="maincontent.html" name=main width=100% height=500 scrolling=auto frameborder=0></iframe></span>

</td></tr></table>

</body>
</html>

-Stu

Paul Jr
03-27-2004, 10:11 PM
Originally posted by DesignersToolz
<span style="position: absolute; left: 20%; top: 3%">
<iframe src="topframe.html" name=title width=90% height=20% scrolling=NO frameborder=0></iframe></span>
That's incorrectly mixing HTML with CSS. To specify a dimension with a unit identifier other than "px", you will have to use CSS.

<span style="position: absolute; left: 20%; top: 3%">
<iframe src="topframe.html" name="title" scrolling="no" frameborder="0" style="width: 90%; height: 20%;"></iframe></span>



Frames should be avoided like the plague, but if you aren't going to stop using them, then I would recommend a frameset, instead of absolutely positioning several Iframes, since that is the general layout of the iframes.

DesignersToolz
03-27-2004, 10:15 PM
I got away from frames awhile ago. There ugly and they cause problems. Theres almost always no need for them. I'd run from them if I were you.:rolleyes:

kidzer
03-27-2004, 10:35 PM
Paul Jnr.

How would i make my code into a frameset?

I'm sorry to sound like i cant do anything but im really new to web design and whats in that site is pretty much all i know!

Thanks for all the Help though!!!!

David, 14

Paul Jr
03-27-2004, 11:05 PM
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head><title>Ryan Sharp -- 2003 German Formula Renault Champion</title>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />
<meta name="Author" content="David Milne 2004" />
<meta name="Description" content="Ryan Sharp is an Aberdeenshire based racing driver with a bright future ahead of him" />
<meta name="KeyWords" content="Motor Racing, Mostorsport, Norco, Formula One, Ryan Sharp" />
</head>

<frameset rows="20%, *">
<frame src="topframe.html" name="title" scrolling="no" frameborder="0" />
<frameset cols="20%, *">
<frame src="leftframe.html" name="menu" scrolling="no" frameborder="0" />
<frame src="maincontent.html" name="main" scrolling="auto" frameborder="0" />
</frameset>
<noframes>
<body>
<p>This document is contained within a frameset. Your web browser does not support frames, please upgrade to more recent version of
your browser.</p>
</body>
</noframes>
</frameset>
</html>

From what I could see, that would be the layout of the frameset.

kidzer
03-27-2004, 11:23 PM
That's great man, but now there's unattractive white lines between all the frames, i dont mean to be picky but i've put a lot of work into the site and i would realy appreciate it if you could tell me houw to remove them

Thanks in advanvce!!!


David, 14