Problem bei Web-Design, Firefox und Chrome zeigen verschiedene Dinge an

Push-Nachrichten von MacTechNews.de

Würden Sie gerne aktuelle Nachrichten aus der Apple-Welt direkt über Push-Nachrichten erhalten?

Forum>Entwickler>Problem bei Web-Design, Firefox und Chrome zeigen verschiedene Dinge an

flowgrow19.09.1218:01

Hey leute,
ich hab mich zwar schon lang nicht mehr gemeldet, und ich weiß auch, dass dieses Forum nicht unbedingt für fragen wie diese geeignet ist. Aber irgendwie scheint mir die MTN community am sympathischsten und ich hoffe, dass sich vielleicht einer hier mein Problem ansehen könnte.

Das Problem ist folgendes:
Ich versuche der Band meines Cousins eine Website zu gestalten. Design hat er gemacht und ich bin für die Technische Umsetzung zuständig. Die Navigationsleiste ist mein erstes angegangenes Kapitel und gleich schon Ursache für mein Problem.

HTML sieht so aus.

<div id="links">
            <div id="presse" class="navLink active l1">
                <a href="#" class="navPic active"></a>
                <a href="#" class="navText active"></a>
            </div>
            <div id="kontakt" class="navLink l2">
                <a href="#" class="navPic"></a>
                <a href="#" class="navText"></a>
            </div>
            <div id="live" class="navLink l3">
                <a href="#" class="navPic"></a>
                <a href="#" class="navText"></a>
            </div>
etc.

CSS so:

#kontakt a {
    background-position-x: -129px;
}

#live a {
    background-position-x: -258px;
}

#musik a {
    background-position-x: -387px;
}

#video a {
    background-position-x: -516px;
}

#photo a {
    background-position-x: -645px;
}

#band a {
    background-position-x: -774px;
}

.navLink {
    float: left;
    width: 129px;
    height: 169px;
}

.navLink a {
    float: left;
}

a.navPic.active {
    background-position-y: -129px;
}

a.navText.active, a.navText:hover, a.navText.hover {
    background-position-y: -80px;
}

a.navText:active, a.navText.click {
    background-position-y: -40px;
}

.navPic {
    width: 129px;
    height: 129px;
    background: url(pics/Fotos.png) 0 0;
}

.navText {
    width: 129px;
    height: 40px;
    background: url(pics/Links.png) 0 0;
}

dann hab ich noch ein paar jquery funktionen eingebaut und in safari und chrome sieht es aus wie ih mir das vorstelle, jedoch in firefox funktionierts leider gar nicht.

Hier noch ein link auf meine Dropbox zum ansehen

Vielen dank schon jetzt für eure antworten
lg
Flo

„Chuck Norris hat mehr Kreditkarten als Max Mustermann!“

Kommentare

bmc desgin20.09.1202:13

Kann leider auf m iPhone keine frage finden???

„Ask your questions...“

ChrisK20.09.1204:50

FireFox versteht background-position-x/-y nicht. Versuchs mal mit background-position:Xpx Ypx;

Es gibt eine Menge CSS (3) Befehle, die noch nicht standardisiert sind. Wenn du mit denen rumspielst musst du immer gucken, ob die auch bei beiden identisch sind oder nicht.

„Wer anderen eine Bratwurst brät, hat ein Bratwurstbratgerät.“

flowgrow21.09.1221:03

vielen dank fürs anschauen, hat geklappt. es gab dann bei der animation zwar noch ein paar probleme, aber die habe ich mit hilfe von google lösen können
hat sich also erledigt

ich nehms jetzt wieder von der dropbox.

„Chuck Norris hat mehr Kreditkarten als Max Mustermann!“

dom_beta22.09.1215:52

Hallo,

ich habe mal gehört, man sollte seine Webseiten mit Opera testen, da sich Opera zu annäherend 100% an die Spezifikationen des W3C hält.

Wenn deine Seite dann im Opera Browser falsch angezeigt wird, hast du irgendwas falsch gemacht.

MfG

„...“

_mäuschen22.09.1216:32

Soso. Du hast mal gehört…

dom_beta22.09.1217:50

Ja, wobei ich glaube auch, dass das stimmt.

Der Chefentwickler arbeitet doch beim W3C oder nicht?!

„...“

Kommentieren

Diese Diskussion ist bereits mehr als 3 Monate alt und kann daher nicht mehr kommentiert werden.

Apple Intelligence: Weiterhin Nonsens-Zusammenf...

Facebook & Instagram: Zuckerberg kündigt Aus de...

Apple gewährt Einblick in Audio- und Video-Test...

Test AirPods Pro 2

iPad Pro M4: Hinweise auf geringere Nachfrage

IMAP und Abstürze: Apple bekommt die Probleme m...

iPad Pro M4 wird grün – Displayfehler bei immer...

Doch keine finalen Versionen: Apple gibt zweite...