Inline Frames

Most people use inline frames in a table. It's easier to put it exactly where you want it that way.

This is the html you need:

<iframe src="initial page" height="height" width="width">

If you don't want a scrollbar in your frame, add this to the basic tag:

scrolling="no"

Or, if you always want the scrollbar to show up, put "yes" instead of "no."

If you don't want a border around it, add this:

frameborder=0  border="0"

If you want a small border, add this:

style="border: 1px solid black"

Obviously, change the size/color/type to whatever you want. The different border types are: solid, dotted, dashed, double, groove, ridge, inset, outset. It's important to leave frameborder="0" in the tag because otherwise the border will look ugly.

If you have an image as your main page background and want it to show through the inline frame, you have two options. First, you can add that image as the page background to every page, after adjusting it to the right size and making sure the edges are even with the larger image, or, you can add transparency to your frame.

To add transparency, add this to the frame tag:

allowtransparency="true"

That's all you need to do to the frame. You need to add this to <style> section of every page that will show in the frame:

body {background-color: transparent}

When you do that, the frame will have a completely transparent background. Sometimes it can be hard to read the text on your page because of this (which I found out while designing version 3). Sure, it looks great, but people will be more inclined to go to your website if they can actually read it. To have a semi-transparent background (which is what I have on version 3), you need to add opacity. Put this in your <style> section instead of the above:

body {background-color: white; filter: alpha(opacity=50)}

Change the background color to whatever color you want, and change the opacity to a number between 1 and 100.

You're done!

Back