home info scripts guides links contact

Centered Frames

how could you ever center a frames layout and have it line up perfectly? or make sure that it is centered and always have the frame on top of it? well, it's no easy task, it actually takes quite a bit of coding and a bit of clever thinking to go along with it. there are a few different methods, but here is the one that i use most often.

files you will be working with:
-index.htm the centralizing code
-index2.htm the actual layout
-frame.htm content for your layout
-nav.htm (optional) frame navigation

Download help files: here

start with your blank page, of course, and then make a table with a width of 100% and a height of 100% as well with no border and align it to the center like this code:


([CONTENT] is just there to show you that the content goes there. you do not have to use that part of the code. take it out once you are familiar that the content goes there)

Now put a code for your frame inside of this table according to the total width & height of your layout. for instance, the entire image for my layout measures at 708 by 428, which will be the dimensions of my frame:


NOTE: DO NOT ALLOW FRAME TRANSPARENCY ON THIS PAGE

I have specifed the name of the frame to be "Text" and its content to be "index2.htm"

Index2.htm

Now make a new page and call it index2.htm, this is the content of the frame that you just made, or your actual layout, with navigation and frame included:

just make your layout in this document, and align it to the upper left of your page. i use this tag to do just that:

<div style="position: absolute; top: 0; left: 0;"> </div>
just go about making your layout as if you didn't care how it was aligned. You can allow frame transparency on this page. The layout that is in the example does not use a navigation frame, but you can also make a navigation frame if you would like to go along with your layout. Again, just go about making your layout as you would normally make a frames layout

Here is my layout so far (index2.htm). It is aligned flush to the left/top of the page. My content is already there, along with navigation at the bottom of the page.

now check back to index.htm and you'll see your layout, perfectly centered in the middle of the page. if there are scrollbars, adjust the width and height of the frame in index2.htm so that they are no longer there

Target any/all links to CONTENT inside of index2.htm. You are not to mess with index.htm at all since all it does is center your layout.

You can also download the help file for a premade template to customize.
copyright 2008 Maggie N