Hi,

vielleicht kann mir jemand sagen woran das liegt. Die Seite

http://www.autohaus-reiniger.com

beinhaltet auf der linken Seite eine Menüleiste. Im IE wird diese korrekt dargestellt. Im Firfox sind die Menüeinträge nach unten verschoben.

Was kann man dagegen tun?


Danke
Heiner

Im Opera sieht es genauso verschoben aus. Das Bild oben in der Mitter ist auch nicht richtig postioniert.

Ist das ganze eine statische Seite oder wird sie in irgendeiner form generiert?

Es ist eine statische Seite.

Hi,

die Ursache findet sich in der äußeren Polsterungseigenschaft margin des p-Elements, die im FF, Opera & Co. einen anderen Initialwert besitzt, als im IE.

Inline-Elemente, wie das a-Element, dürfen aber keine Block-Elemente, wie das p-Element, enthalten.

mfg Maik

Zitat von Maik

Hi,

die Ursache findet sich in der äußeren Polsterungseigenschaft margin des p-Elements, die im FF, Opera & Co. einen anderen Initialwert besitzt, als im IE.

Von welchem Element sprichst du und wie kann man das beheben. Heute ist mir noch folgendes Aaufgefallen. Das Problem tritt auch beim IE 8 auf. Bis jetzt hat das aber immer einwandfrei funktioniert.

Danke
heiner

Moin,

ich rede von diesem p-Element - auszugsweise der erste Menüpunkt:

Code :

1	<a href="wir.htm">[B]<p class="verdana12" style="position:absolute; left:10px; top:25px; cursor:hand;">[/B]Firmengeschichte[B]</p>[/B]</a>

Beheben kannst du dies, indem das Element daraus entfernt wird, da es, wie gestern Abend erwähnt, innerhalb eines Inline-Elements nichts zu suchen hat, und die Positionierung stattdessen an das a-Element übergeben wird.

mfg Maik

Du meinst also so´?

Code :

1	a href="wir.htm" class="verdana12" style="position:absolute; left:10px; top:25px; cursor:hand;">Firmengeschichte</a>

Heiner

Ja.

cursor:hand entfällt somit auch.

mfg Maik

Das werde ich mal versuchen. Ich hoffe es klappt.

Vielen Dank
Heiner

Das klappt einwandfrei.

Mal abgesehen von den absoluten Positionsangaben gepaart mit den Inline-Styles (Formatierung im HTML-Element) liesse sich die Navigation wesentlich eleganter mit einem <ul>-Listenelement auszeichnen und mittels CSS formatieren, womit die immer wiederkehrenden <img>-Elemente aus dem HTML-Code verbannt werden können, da sie sich als Hintergrundbilder für das <li>- und <a>-Element nutzen lassen.

mfg Maik

Es scheint soweit zu funktionieren, so das die Verschiebung weg ist. Allerdings ändert sich der Schrifttyp. Vielleicht erkennt er das class-attribut nicht.

Code :

1 2 3 4 5

<a href="prospekt.htm" class="verdana9" style="position:absolute; left:18px; top:20px;">Prospekte bestellen</a> . . . <a href="wir.htm" class="verdana12" style="position:absolute; left:10px; top:25px;">Firmengeschichte</a>

Was meinst du?

Für die Klassen ist doch keine Schriftart deklariert.

mfg Maik

Dochim dazugehörigen CSS file:

Code :

1 2 3 4 5 6 7 8

p {font-family: Verdana;} .verdana9       { color: black; font-size: 9px;} .verdana9bold   { color: black; font-size: 9px;font-weight:bold;} .verdana12      { color: #999999; font-size: 12px;} .verdana12bold      { color: #999999; font-size: 12px;font-weight:bold;} .verdana12dg    { color: #666666; font-size: 12px;} .verdana14rot   { color: #e50000; font-size: 14px;font-weight:bold;} .verdana12bk    { color: #000000; font-size: 12px }

Das p-Element existiert doch nicht mehr im HTML-Code, somit läuft diese CSS-Regel jetzt auch ins Leere.

mfg Maik

Das heißt ich muß das für das a-element deklarieren?