Let's design a simple frame page now.

On your homepage, set up a master file. I've called mine, "master.html". This is where you'll put the actual html code for the frames.

The frames page we'll be making is similar to mine, but you can make yours in any configuration that you like.

This one will have one column on the left, with the second column on the right having two rows.

Start with the <<>frameset cols="*,*"> command.

NOTE: There is more than one way of telling the computer what dimensions you want.

You could use percentages; such as <<>frameset cols="25%,75%">

This tells the computer you want to divide the window into two parts; the first column taking up 25% of the screen (this will be on the left), the second column (on the right) will take up 75% of the screen, for a total of 100%.

The second way of writing this would be; <<>frameset cols="120,*">. What you are saying here, is to make the two columns; the first column is a set amount, the second column is a variable (*). What this means is the first column will be 120 pixels wide and the second will take up the rest of the screen.

If at all possible, you should use the second way of writing <<>frameset>. The first way might look good on your screen, but it could look lousy on a different browser.

You can divide the screen into as many columns and rows as you wish. If you want three columns, write it like this:
<<>frameset cols="50%,25%,25%">. Or this,
<<>frameset cols="120,*,*">. This means, divide the window into three columns; first one (left) 120 pixels, second (middle) half of what's left, third (left) half of what's left.

Another way is: <<>frameset cols="120,*,2*">. Translated: First column=120 pixels, the rest is divided between columns 2 and 3, but make column 3 twice as big as column 2 (2*).

These methods also work for Rows. Example:

<<>frameset rows="90,*,*">

TIP: Until you get used to the way Frames work, you might want to set up some dummy files to use with your master file.
In other words, after we set up the master.html file, go ahead and set up four or more files and just name them
one.html, two.html, three.html (or more, if you want to experiment with how many times you can divide the screen ~grin~); give each of the files a different color and center the words, one, two, three, ect., on the page.
This way, you can plainly see where each of the files are going as you make changes.

Top of Page


Page Three Page One Home

This page hosted by

Get your own Free Homepage