Positioning in Internet Explorer 3.0x
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:
font: 80pt 'Wingdings', 'fantasy';
(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:
font-family: "'Trebuchet MS', 'Arial', 'Sans-Serif'";
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:
Note the class attribute.
- 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)