CSS (Cascading Style Sheets)

Page 4

Frames Pages Styles Tutorial

When if comes to frames pages and that nasty little white line that is between them when they are done as the W3C recommends, it is a bit of a pain to deal with.  However, there is a fix this problem by simply using CSS on the frames set page.

First of all, you have your normal frames set as below.

<html>
<head>
<title>New Page 1</title>

</head>

<frameset rows="64,*">
<frame name="banner" scrolling="no" noresize target="contents" src="title.htm">
<frameset cols="150,*">
<frame name="contents" target="main" src="menu.htm">
<frame name="main" src="main.htm">
</frameset>
<noframes>

<body>

<p>This page uses frames, but your browser doesn't support them.
</p>

</body>

</noframes>
</frameset>

</html>

To be rid of those nasty white lines between the pages the frames set brings up, do the following.

<html>
<head>
<title>New Page 1</title>

</head>

<frameset rows="64,*" style="background-image: url('image.jpg')">
<frame name="banner" scrolling="no" noresize target="contents" src="title.htm" style="background-image: url('image.jpg')">
<frameset cols="150,*"style="background-image: url('image.jpg')">
<frame name="contents" target="main" src="menu.htm" style="background-image: url('image.jpg')">
<frame name="main" src="main.htm" style="background-image: url('image.jpg')">
</frameset>
<noframes>

<body>

<p>This page uses frames, but your browser doesn't support them.
</p>

</body>

</noframes>
</frameset>

</html>

What I've done is add style="background-image: url('image.jpg')" to the end of each item on the page where necessary to be rid of those nasty lines.  It's not really all that hard to do once you know where to place them and how.

A Reminder

When doing any image inserting, remember to point to where you are storing those images being used, or they will not show on your pages.  For example:

style="background-image: url('images/yourgraphic.jpg')"


[ CSS 1 | CSS 2 | CSS 3 | CSS 4 ]

  

[ About Me | Site Legal Info | Site Design | CSS Coding ]
[ JavaScripts | Hints & Tips | BackGrounds | Misc. Images ]
[ Templates | Logo Page | Special Characters | Color Chart ]
[ Contact Us! | Awards Won | Links ]
[ Home | Site Map ]

 

Go to Top


Webmaster & Owner: Anita Eberline
No part may be reproduced without prior permission by Anita Eberline