Schattierung überall wunderbar, nur IE spinnt iweder

[rethus]

Hallo Leute,
ich habe nun ein Layout umgesetzt, das an der unteren und rechten Kannte einen Schatteneffekt aufweisen soll.

Da ich ungern mit Tabellen bei Layoutgeschichten arbeite, habe ich versucht, den Schatten in Form von DIVs anzupassen.

Bei allen Browsern t das wunderbar, nur beim IE (bei keinem bis auf den 8.0er) mal wieder nicht.
Siehe hier: http://browsershots.org/http://www.ilgner-schleif-innovationen.com/cms/front_content.php?idcat=52

Kann mir jemand sagen, wo der IE da sein Problem hat? Was interpretiert der schon wieder falsch, das der so einen Müll ausgibt?

 

[Maik]

Hi,

der IE hält in den Elementen einen Platzhalter für den theoretisch folgenden Text bereit, der sich an der global eingestellten Schriftgröße orientiert, die sicherlich größer als 7px ist - Abhilfe schafft da i.d.R. overflow:hidden.


P.S. Vermeide hier im Forum zukünftig bitte besser die Kurzform "f-u-n-z-t" von funktioniert, da sie vom Forensystem herausgefiltert wird, und in deinem Beitrag nur noch ein verstümmeltes nichtssagendes "t" übrig bleibt. Vielen Dank!

 

[rethus]

Ich danke dir, hab es mal eingepflegt, und den Browsershoot nochmal gestartet.Was aber immernoch nicht weggehtr, ist der lange schatten oben... der schatten soll ja erst neben den Inhalten erscheinen.Ich meld mich aber nochmal mit aktuellen Screenshots.

 

[rethus]

So hier kommen die nächsten Screenshots.
Unten rechts die ecke fehlt, die ich vie background_position buttom right; ausgerichtet habe, die aber im IE nicht erscheint, und zudem ist oben rechts der Schatten bis an den Seitenanfang gezogen. DSer sollte eigentlich nur bis in die Höhe von "Kontakt | Sitemap"

Und hier wieder der Link zur orginalseite:http://www.ilgner-schleif-innovationen.com/cms/front_content.php?idcat=41

 

[rethus]

Hier der vereinfachte Code HTML und CSS

http://pastebin.com/d1f0175e

http://pastebin.com/d1b2838a0

Jemand ne Idee?

 

[Maik]

Vielleicht solltest du es von Grund auf mit einer alternativen "Dropshadow"-Technik versuchen, die sich im IE bewährt hat:

• CSS
  • CSS Drop Shadows
  • CSS Drop Shadow Tests :: By Phil Baines
  • Easy CSS drop shadows
  • Lurking in Shadows: CSS and drop shadow effects
  • Multi-position shadow boxing
• JS
  • CSS Javascript Drop Shadow
  • Drop Shadow Plugin

 

[rethus]

Ich danke dir für die Mühe, die ganzen Links heraus zu suchen.
mittlerweile habe ich es geschafft, den überlangen Schatten entsprechend einzukürzen.
Es war eine Zuordnung im CSS in bezug auf margin-top daran schuld.

 

[Maik]

Die Links aus meinen Bookmarks hier reinzustellen, war überhaupt kein Aufwand ;-)

Aber wenn ich deine verlinkte Seite in den genannten Browsern betrachte und vergleiche, frage ich mich, was du da nun konkret hinbekommen hast, außer dass die rechte untere Ecke des Schattens in den nicht-IE-Browsern wieder angezeigt wird.

Der rechte Schatten erstreckt sich noch immer bis zum oberen Elementrand, obwohl du ihn doch ein Stückchen darunter schon enden lassen wolltest, und dass der IE6 den unteren Rahmen nun wieder doppelt und dreifach aus den genannten Gründen anzeigt, wird dir wohl auch nicht entgangen sein.

Zudem zeigen er und sein Nachfolger IE7 nun "brüderlich vereint" zwei vertikale Scrollbalken im Viewport an, obwohl es darin überhaupt nichts zum Scrollen gibt.

Alles in allem würde ich sagen, dass du ganz souverän wieder den Status Quo zu Beginn des Threads hergestellt hast, und kann dir nur empfehlen, meine heute früh vorgeschlagenen Seiten zu besuchen und dir deren Techniken mal genauer anzuschauen, denn mit denen tauchen im IE6 keine derartigen Darstellungsfehler auf.