Grafik vor Link (onMouseOver) erscheint nicht beim IE, aber bei den anderen Browsern

[pit]

Hallo,

habe Euren Rat befolgt und alles mit CSS aber OHNE Tabellen probiert!

Ich habe aber zwei kleine Fragen!

Hier ein Testlink als Beispiel!

Beispiel

Frage 1:
Bei der Navigation soll bei "onMouseOver" ein kleines Quadrat vor dem Text
erscheinen. Normal kein Problem! Mit Firefox, Opera, .... geht das auch!
Beim IE jedoch nicht!!! Außer man hat im Code bei

".navi a { padding-left: 20px; ..." und ".navi a:hover { padding-left: 21px; ..."

zwei unterschiedliche "padding-werte". Dann verschiebt sich natürlich auch der Link.


Frage 2:
Wie wird in allen Browsern eine Zentrierung auf Seitenmitte erzeugt?

Ist schon komisch! Mit Tabellen, ... gabs Probleme mit Firefox, ... - jetzt ohne Tabellen mit dem IE.
Gruß,
Pit

 

[dkdenz]

Du kannst auch zwei verschiedene padding-Werte in einer Anweisung schreiben.
Dazu schreibst Du zuerst bspw.

padding-left:21px !important;
padding-left:20px;

Was bedeutet das?
IE interpretiert !important nicht, deswegen 'überliest' er die Anweisung und führt die Zweite aus.
Die richtigen Browser führen die erste Anweisung aus.

Zentrieren:
http://forum.jswelt.de/showthread.php?t=19378

Bild vor/hinter Link:
http://forum.jswelt.de/showthread.php?t=22169

 

[pit]

AW: Grafik vor Link (onMouseOver) erscheint nicht beim IE, aber bei den anderen Browsern

Hi,

danke für die schnelle Antwort!

Das mit dem !important verstehe ich, aber ich will ja, daß
sich der Link NICHT verschiebt. Das soll so ausschauen wie mit Firefox & Co.!!!

Wenn ich zwei gleiche Werte habe, dann kommt beim IE das Quadrat NICHT wenn ich auf den Link gehe!

Ich habe das gleiche Layout vorher mit Tabellen und CSS gemacht und da gab es das Problem nicht.
Das steht bei beiden Werten "padding-left: 20px". :whacky:

Habe auch nur interne Links!

Zentrieren:
Gibts da auch 'ne Möglichkeit die Webseite von ALLEN Seiten zentriert darzustellen???

Gruß,
Peter

P.S. Ein Moderator schläft wohl nie was?

 

[dkdenz]

AW: Grafik vor Link (onMouseOver) erscheint nicht beim IE, aber bei den anderen Browsern

Ein Moderator schläft selten...

Das Beispiel mit den externen Links kannst Du natürlich auch auf interne Links anwenden.
Ich habe das nur gepostet, weil Du danach gefragt hast.

Und das mit dem Verschieben und !important geht doch?

.navi a { 
        padding-left: 20px !important; 
        padding-left: 21px;  
        font-family: Arial, Helvetica, sans-serif;        
        font-size: 12px;                
        color: #CCCCCC;
        text-decoration: none;
        background-repeat: no-repeat;
}

.navi a:hover {  
        padding-left: 20px !important; 
        padding-left: 21px;   
        background-image:  url(graphics/quadrat.gif);             
        color: #FFFFFF;
        text-decoration: none;
}

 

[womstar]

AW: Grafik vor Link (onMouseOver) erscheint nicht beim IE, aber bei den anderen Browsern

display:block

 

[planet4]

hallo,

wenn du in deine style-Anweisung für den link reinschreibst:

background-color: transparent;

dann zeigt auch der IE das Hintergrundbild (das weiße Kästchen) an (erscheint mir nicht ganz logisch,
aber ist so; man soll eigentlich auch immer eine Hintergrundfarbe angeben, wenn man eine Farbe
für die Schrift angibt)

zum Zentrieren:

<DIV style="WIDTH: 752px; HEIGHT: 500px;
MARGIN: 0px auto;
BORDER-RIGHT: #333333 1px solid; BORDER-LEFT: #333333 1px solid;
BACKGROUND-COLOR: #A41616;
TEXT-ALIGN: left">

planet4.

 

[pit]

AW: Grafik vor Link (onMouseOver) erscheint nicht beim IE, aber bei den anderen Browsern

Hi,

vielen Dank!

Nur das mit dem Zentrieren auf Seitenmitte haut nicht so einfach hin.

Ich hätte gerne eine Zentrierung von ALLEN SEITEN also auch von Oben und Unten!

In dem Link von dkdenz wir der Inhalt leider auch nur seitlich zentriert!

http://forum.jswelt.de/showthread.php?t=19378

Gibt es da keine Lösung?


Gruß,
Peter

 

[dkdenz]

Was meinst Du denn mit 'seitlich zentriert'?
Natürlich geht das mit den Beispielen hinter dem obigen Link...

 

[pit]

AW: Grafik vor Link (onMouseOver) erscheint nicht beim IE, aber bei den anderen Browsern

Hi,

das die Beispiele nicht funktionieren habe ich ja nicht gesagt!

Meine Seite ist 750x550 Pixel groß! Diese Seite soll immer von allen Seiten zentriert im Browser dargestellt werden. Bei den Beispielen wird die Seite aber nur links und rechts zentriert dargestellt. Der obere und unter Teile wird nicht aufgeteilt. Die Seite wird oben bündig dargestellt.

Ich habe das Beispiel mal kopiert und mehr Text eingefügt. Dann sieht man es deutlich.

Gruß,
Peter

 

[dkdenz]

Sorry, bin schlecht im Raten.
Habe jetzt erst kapiert, das Du eine vertikale Zentrierung meintest...
Beispiellayout:
http://intensivstation.ch/files/templates/temp11.html