Positioning in Internet Explorer 3.0x

First, note that the positioning methods for Netscape and Internet Explorer described in these pages are not the only ways to create overlays. However, using the methods described here will allow you to write one page that will work for all three browsers, provided that you use a JavaScript to load a appropriate style sheet for each browser and to write the foreground layers (these scripts will be presented following the explanation of positioning).

Creating overlays in IE 3.0(x) requires a somewhat different strategy than IE 4.0 or Netscape 4.0, because IE 3.0 does not support positioning in the same way, Instead, you will need to use the Box margin properties (margin-top, margin-left, etc.).

The background portion of the overlay can be any element or class:

	P.hugeding
	{		
		font: 80pt 'Wingdings', 'fantasy';
		color: #FFFF99;
		}

(Note that if the element you use has background color, you will need to use a different element for the foreground (one that has no background color) or the color will completely hide the background element.

Aside from the background-color consideration, the foreground portion of the overlay can be any element, but since it will be positioned, you will probably want to create a special class for the purpose:

	.shadow3
	{		
		font-family: "'Trebuchet MS', 'Arial', 'Sans-Serif'";
		font-weight: bold;
		font-size: 30pt;
		color: #336666;
		text-align: left;
		margin-top: -70pt;
		margin-left: 38pt;
		}

Note the positioning here using the margin-left and margin-top properties; the values are best determined by trial and error.

The contents that are to be overlayed on the background should be placed after the background element, using the <p> tag with the appropriate class:

	<p class=hugeding>
	0
	</p>
	<p class=shadow3>
	Files
	</p>

Note the class attribute.

Additional notes:

using the <span> tag for the foreground element has produced inconsistent results for me; that is why I recommend a separate paragraph following the background element
because of the lack of true positioning in IE 3.0, overlays only work when the foreground text is all on one line; to ensure this, you need to use very short strings of text, or enclose the overlay in a table with a sufficient fixed width (a practice I do not recommend, as it will result in the necessity of horizontal scrolling for users operating at low resolutions)