Positionieren in Internet Explorer 3.0x

Positionieren in Internet Explorer 3.0x

Beachten Sie bitte, daß die Methoden zum Positionieren für Netscape und Internet Explorer, die auf dieser und den folgenden Seiten beschrieben werden, nicht die einzigen Wege zum Erstellen von Overlays sind. Der Einsatz der beschriebenen Methoden erlaubt es Ihnen aber, eine einzige Seite zu schreiben, die mit allen drei Browsern funktioniert, vorausgesetzt, Sie benutzen ein JavaScript, um das für den jeweiligen Browser passende Style Sheet zu laden und um die Vordergrundebene zu schreiben (diese Scripts werden nach der Erklärung der Positionierung vorgestellt).

Das Erstellen von Overlays in IE 3.0(x) erfordert eine etwas andere Strategie als für IE 4.0 oder Netscape 4.0, weil IE 3.0 kein Positionieren in der gleichen Art kennt. Stattdessen werden Sie die Eigenschaft margin von Box nutzen müssen (margin-top, margin-left usw.).

Der Hintergrundteil des Overlays kann ein beliebiges Element oder eine Klasse sein:

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

(Beachten Sie: wenn das verwendete Element eine Hintergrundfarbe hat, müssen Sie ein anderes Element für den Vordergrund verwenden (eines ohne Hintergrundfarbe) oder die Farbe wird das Hintergrundelement komplett verdecken.

Von der Überlegung zur Hintergrundfarbe abgesehen kann der Vordergrundteil des Overlays jedes Element sein, aber da es positioniert wird, wollen Sie vielleicht eine spezielle Klasse für diesen Zweck erstellen:

	.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;
		}

Die Positionierung verwendet hier die Eigenschaften margin-left und margin-top; die Werte ermittelt man am besten durch Ausprobieren.

Der Inhalt, der mit einem Overlay versehen werden soll, sollte nach dem Hintergrundelement angeordnet werden, in dem Sie das <p>-Tag mit der passenden Klasse verwenden:

	<p class=hugeding>
	1
	</p>
	<p class=shadow3>
	Name
	</p>

Beachten Sie das Attribut class.

Zusätzliche Bemerkungen:

die Benutzung des Tags <span> für das Vordergrundelement hat bei mir nicht zu einheitlichen Resultaten geführt; deshalb empfehle ich einen separaten Absatz nach dem Hintergrundelement
durch das Fehlen von echtem Positionieren IE 3.0 funktionieren Overlays nur dann, wenn der Vordergrundtext ganz in eine Zeile passt; um das sicherzustellen, müssen Sie sehr kurze Texte verwenden oder das Overlay in eine Tabelle mit ausreichender festgelegter Breite schreiben (eine Vorgehensweise, die ich nicht empfehle, da sie dazu führt, daß einige Benutzer horizontal scrollen müssen, die mit niedriger Auflösung arbeiten)

Bernhard Friedrich

doozer@hsguide.com