Angaben für einzelne Browser definieren

Anina · 19.09.2010

Hallo!

Ich habe ein kleines (oder auch großes) Problem. Ich mache meine Webseiten mit Dreamweaver (CS5). Dort sollte ich jetzt ein etwas tückisches Layout umsetzen und habe dafür unter anderem zwei AP-Elemente definiert.

Jetzt wird deren Position aber je nach Browser unterschiedlich interpretiert. Im IE 8 passt alles, bei IE 7 wieder nicht und bei Firefox 3.5. passts wieder...
Das ist natürlich ein Problem, denn es sollte ja immer richtig angezeigt werden.

Kann ich in meinem CSS evtl. sagen: "Wenn du mit IE8 geöffent wirst, stehst du da und wenn du mit IE7 geöffnet wirst hier."?

Oder gibt es eine Alternative zu den AP-Elementen?

Hier mal die vielleicht hilft das als Beispiel. Die AP-Elemente sind der untere Teil des Logos oben rechts und die Flaschen unten links.

Ich hoffe ihr könnt mir einen Tipp geben, mir fällt echt nichts mehr ein.

Liebe Grüße
Anina

Pixelverwender · 19.09.2010

AW: Angaben für einzelne Browser definieren

Linktipp:

Schau auch generell mal „CSS-Hacks“.

Nachtrag: Hier geht's speziell ums Thema IE 7 Hacks:
Cascading Style Sheets : Artikel : Internet Explorer 7

Edit: Oops, jetzt ist der Beitrag doppelt...?
@Admins: Der erste kann gelöscht werden

Und noch ein P.S.: Ist das so gewollt, dass die Dropdown-Menüs ca. 1 cm unterhalb der Navileiste aufgehen und nicht direkt an die Leiste anschließen? (FF 3.6.10 unter Win XP)
Beim IE 8 schließen sie nämlich direkt an.

Anina · 19.09.2010

AW: Angaben für einzelne Browser definieren

Hi!

Danke schön, habe mir das mal durchgesehen... für mein Problem habe ich jetzt aber keine Lösung gefunden.

Nein, das mit dem Dropdown Menü (wurde als Spry-Menü gemacht) ist auch keine Absicht... genau das gleiche Problem wie bei den AP-Elementen - da interpretiert wieder jeder Browser die Position anders... :-(

Pixelverwender · 19.09.2010

AW: Angaben für einzelne Browser definieren

Was die Dropdown-Menüs betrifft, würde ich nicht auf Spry setzen, sondern auf eine reine CSS-Lösung.

Schau doch mal hier vorbei:

Was die Hacks für den IE betrifft, gibt es hier auch noch Lösungsansätze:
Internet Explorer - CSS Hack - Browser Hack - Hacks für browserüberfreifendes CSS-Design

Anina · 19.09.2010

AW: Angaben für einzelne Browser definieren

Hm.. das versuche ich mal...
Aber wirklich genaue Angaben für einen einzelnen Browser kann ich nicht machen?

zome · 20.09.2010

AW: Angaben für einzelne Browser definieren

Hallo Pixelschubserin,

ich kann dir nur empfehlen, hierfür die von Microsoft vorgeschlagene Einbindung zu verwenden:
d.h. Du bindest versch. externe CSS-Dateien für die einzelnen IEs ein.

Diese Technik nennt sich "Conditional Comments (CC)":
Die anderen Browser "überlesen" diese, da Sie für diese nur als Kommentar gelten. Die IEs hingegen fassen diese Zeilen als normalen Befehl auf. So kannst Du jedem IE sein eigenes CSS zuweisen.

<head>





</head>

Es gibt auch noch <!--[if lte IE 8]>, <!--[if gte IE 8]>...
"lte" = less than or equal -> kleiner gleich
"gte" = greater than or equal -> grösser gleich

und bitte keine Hacks verwenden

ekiam14 · 20.09.2010

AW: Angaben für einzelne Browser definieren

Hallo,

ich behlefe mich ab un an mit dem IE-Tester (My DebugBar | IETester / Browser Compatibility Check for Internet Explorer Versions from 5.5 to 9).

Ist zwar kein Allerheilmittel aber ab und zu hilft es.

Gruß
Ekiam14

fexx · 20.09.2010

AW: Angaben für einzelne Browser definieren

schau dir das mal an

einfaches dropdown/suckerfish menu mit einem kleinen js für den IE 6

Anina · 20.09.2010

AW: Angaben für einzelne Browser definieren

Hallo!

Danke euch allen, das probiere ich mal aus!

@zome
Oh, cool, wenn das funktioniert, wäre es ja genau so, wie ich mir das gedacht hätte... heute gleich mal testen. Danke schön!!!

TomorrowGraphics · 20.09.2010

AW: Angaben für einzelne Browser definieren

Sonst wäre im Zweifelsfall auch Position:Absolut; eine Möglichkeit gewesen...

Manfred62 · 21.09.2010

AW: Angaben für einzelne Browser definieren

Hallo

Bin etwas erstaunt, dass du die Seite in diesem Zustand dem Kunden übergibst!

Mal ein Beispiel, wie es ohne Spry, Dreamweaver usw. geht --> in jedem Browser.
Schau dir auch mal die Verwendung der Grafiken an.
Das ist kein Gesamtgemälde, welches gesliced wird.

Weitere Stichworte: Image Replacement, Semantik, fehlerfreie Validierung...

Weinbau Steuer Miltenberg

Gruß Manfred

EDIT: sowas wie "Optimiert für Internet Explorer 8" ist ein NoGo.
Da könnte sonst auch stehen: "ich kann es nicht besser.."