Opera: CSS-Bug geknackt

[Malcolm Beck´s]

hi,

Bug, 10. 04. 2008, 02:11
Ich gab nicht auf, Bug 13. 07. 2009, 06:58

Kurze zusammenfassung: Opera hat Probleme beim einblenden von gehoverten Elementen, dabei schien es egal, ob der eingeblendete Content durch CSS generiert wurde, oder HTML-Code war, Opera hat in den meisten Fällen ein Problem damit, vor allem, wenn noch Eigenschaften wie position mit top bzw. bottom, oder schlimmeres, top _und_ bottom (die ja eigentlich zusammengehören), ins Spiel kamen.

Knappe 2 Jahre der Intensiven Erforschung dieses Bugs haben sich nun bezahlt gemacht:

22. 02. 2010, 18:31, Bug geknackt, Opera beknackt!
Im CSS-Block ist ein Link neben der Überschrift, mit dem man den Bugfix aktiviert, so kann man sich auch gleich mit ansehen, was Opera Probleme bereitet (eine Kombi aus scrollen und hovern -- Skurriler Bug).

Ich habe nur einen Opera 10.10, daher weiss ich nicht, ob diese Lösung auch auf älteren Operas anwendbar ist.

Wäre Nett, wenn ihr ein paar Browser für die Browsercharts hier posten könntet, in denen es funktioniert oder nicht funktioniert.

mfg

[Bolle]

Hi,

hab mir gerade mal deine Seite angeguckt. Gefällt mir super! Nur so nebenbei, hab leider keinen Opera.

Gruß
Bolle

[Kai345]

[latex]Mae  govannen![/latex]

22. 02. 2010, 18:31, Bug geknackt, Opera beknackt!
Im CSS-Block ist ein Link neben der Überschrift, mit dem man den Bugfix aktiviert, so kann man sich auch gleich mit ansehen, was Opera Probleme bereitet (eine Kombi aus scrollen und hovern -- Skurriler Bug).

Ich habe nur einen Opera 10.10, daher weiss ich nicht, ob diese Lösung auch auf älteren Operas anwendbar ist.

Ab 9.5 sieht es gut aus, bei 9.27 hängen die Tips irgendwo weit weg vom Basiselement in der Pampa. Daher habe ich ältere Operas gar nicht erst getestet, weil der Fehler da wahrscheinlich ebenfalls vorhanden ist. Aber die 9.2-Serie ist so alt (April 2007-April 2008), daß sie wenig relevant sein dürfte. Da es ab 9.5 (12. Jun. 2008) funktioniert: Kann man so durchgehen lassen ;)

Cü,

Kai

[Malcolm Beck´s]

hi,

Ab 9.5 sieht es gut aus, bei 9.27 hängen die Tips irgendwo weit weg vom Basiselement in der Pampa.

Danke für den Hinweis, habe ich gleich so übernommen.

Daher habe ich ältere Operas gar nicht erst getestet, weil der Fehler da wahrscheinlich ebenfalls vorhanden ist.

Wieviele hast du denn, Sammelst du die dinger etwa? ;)

Kann man so durchgehen lassen ;)

Endlich ;)

mfg

[suit]

Ich habe nur einen Opera 10.10, daher weiss ich nicht, ob diese Lösung auch auf älteren Operas anwendbar ist.

Opera 10.10 unter Vista x64 sieht nach dem mouseout so aus:
http://img202.imageshack.us/img202/1461/ninfoboxopera1010fail.png

Opera 10.10 auf Win XP funzt augenscheinlich

[suit]

Opera 10.10 unter Vista x64 sieht nach dem mouseout so aus:
http://img202.imageshack.us/img202/1461/ninfoboxopera1010fail.png

Opera 10.10 auf Win XP funzt augenscheinlich

Nachtrag: soll heissen, dass der Bug offensichtlich Betriebssystemabhängig ist (?) - Config ist bei beiden Browser identisch.

[Kai345]

[latex]Mae  govannen![/latex]

Opera 10.10 unter Vista x64 sieht nach dem mouseout so aus:
http://img202.imageshack.us/img202/1461/ninfoboxopera1010fail.png

Bei mir auch. Du arbeitest auch mit der Normal-Version. Aber der Fehler ist nicht mehr vorhanden, wenn man den „Bugfix“ aktiviert, sprich den entsprechenden Link klickt.

Weshalb es bei dir mit 10.10/WinXP funktioniert, ist mir übrigens auch ein Rätsel, denn da sieht es bei mir genau so aus wie auf deinem Bild.

Cü,

Kai

[Malcolm Beck´s]

hi,

Opera 10.10 unter Vista x64 sieht nach dem mouseout so aus:
http://img202.imageshack.us/img202/1461/ninfoboxopera1010fail.png

Eben, dass ist ja besagter Bug, um den es geht.
Den Bugfix habe ich so eingebaut, dass man sich halt beide Versionen ansehen und vergleichen kann, nur war der Link nicht gut zu erkennen; ich habe ihn für dich hervorgehoben :)

Opera 10.10 auf Win XP funzt augenscheinlich

Ohne den Bugfix aktiviert zu haben?

mfg

[suit]

Eben, dass ist ja besagter Bug, um den es geht.
Den Bugfix habe ich so eingebaut, dass man sich halt beide Versionen ansehen und vergleichen kann, nur war der Link nicht gut zu erkennen; ich habe ihn für dich hervorgehoben :)

Schon klar :)

Ohne den Bugfix aktiviert zu haben?

Ja, ohne den Bugfix aktiviert zu haben.

[ChrisB]

Hi,

Kurze zusammenfassung: Opera hat Probleme beim einblenden von gehoverten Elementen, dabei schien es egal, ob der eingeblendete Content durch CSS generiert wurde, oder HTML-Code war, Opera hat in den meisten Fällen ein Problem damit, vor allem, wenn noch Eigenschaften wie position mit top bzw. bottom, oder schlimmeres, top _und_ bottom (die ja eigentlich zusammengehören), ins Spiel kamen.

Absolute Positionierung in Bezug auf relative war im Opera immer schon ein bisschen buggy; mal mehr, mal weniger - manchmal beseitigen sie mit einer neuen Version einen Bug und führen dafür einen anderen ein; oder ein beseitiger kommt mit einer neuen (Version der) Rendering-Engine wieder.
So ungern ich das zugebe, was meinen Lieblingsbrowser angeht - aber das ist eine seine grössten Schwächen in Bezug auf die ansonsten meistens sehr gute bis hervorragende Umsetzung der CSS-Spezifikation.

Beim Hovern kommt dann noch Operas Eingenart hinzu, zugunsten der Geschwindigkeit Repaints/Reflows nach einem, sagen wir mal „eigenartigen“ Modus vorzunehmen - was des öfteren dazu führt, dass er „Artefakte“ von Elementen, die nicht mehr sichtbar sein sollten, stehen lässt. (Altbekannt, siehe u.a. </archiv/2005/9/t114613/#m731251>.)

Im CSS-Block ist ein Link neben der Überschrift, mit dem man den Bugfix aktiviert

Hm, wenn's funktioniert - fein.

Aber das html-Element als inline-block darstellen zu lassen, bereitet mir ein bisschen Bauchschmerzen - habe ich zwar in der Praxis noch nie gemacht, habe aber Bedenken, ob das nicht zu anderen unerwünschten Nebenwirkungen führen könnte.

Wäre Nett, wenn ihr ein paar Browser für die Browsercharts hier posten könntet, in denen es funktioniert oder nicht funktioniert.

10.50 Beta unter Win 7 zeigt in der normalen Seitenversion das fehlerhafte Verhalten; der Fix wirkt.

MfG ChrisB

[Malcolm Beck´s]

hi,

aber das ist eine seine grössten Schwächen in Bezug auf die ansonsten meistens sehr gute bis hervorragende Umsetzung der CSS-Spezifikation.

Und für mich eine der nervigsten, da ich gerne in diese richtung Experimentiere; man sieht ja an den Jahren im ersten Post, wie lange ich es schon versuche.
Und trotz der Tatsache, dass ich Opera nicht leiden mag, habe ich ihn nie ausser acht gelassen ;)

(Altbekannt, siehe u.a. </archiv/2005/9/t114613/#m731251>.)

Ich habe den dort beschriebenen Lösungsansatz mal versucht, mit CSS alleine funktioniert es so nicht, leider.

Aber das html-Element als inline-block darstellen zu lassen, bereitet mir ein bisschen Bauchschmerzen -

Mir auch, es ging mir aber auch nur um das Prinzip. Der Bug an sich scheint zu sein, dass Opera ein Element vor dem body benötigt, dass die Eigenschaft display:inline-block; hat und sich über die länge des Viewport zieht.

In meinem Bsp. genügt es schon, den Header auf display:inline-block;width:100%; zu setzen, oder ein Element vor body einzufügen, dass diese Eigenschaften besitzt, siehe hier.

10.50 Beta unter Win 7 zeigt in der normalen Seitenversion das fehlerhafte Verhalten; der Fix wirkt.

Hier wäre auch Interessant zu wissen, ob es Betriebssystem-bedingt zu unterschieden kommen kann.
Unter Linux/ Unix, Mac und Windows sicherlich, aber kann es auch unter Windows zu grossen unterschieden kommen (Win XP vs. Win 7)?

mfg

[ChrisB]

Hi,

(Altbekannt, siehe u.a. </archiv/2005/9/t114613/#m731251>.)

Ich habe den dort beschriebenen Lösungsansatz mal versucht, mit CSS alleine funktioniert es so nicht, leider.

Nee, natürlich nicht - du hast ja :hover/Normalzustand nur auf einem speziellen Element weit unten in der Hierarchie, und von diesem „Event“ aus kommst du per CSS ja nicht an übergeordnete Elemente wie bspw. HTML oder BODY heran.

Das sollte ja auch nur noch mal verdeutlichen, dass Opera generelle Probleme mit dem Repaint hat.

Mir auch, es ging mir aber auch nur um das Prinzip. Der Bug an sich scheint zu sein, dass Opera ein Element vor dem body benötigt, dass die Eigenschaft display:inline-block; hat und sich über die länge des Viewport zieht.

In meinem Bsp. genügt es schon, den Header auf display:inline-block;width:100%; zu setzen, oder ein Element vor body einzufügen, dass diese Eigenschaften besitzt, siehe hier.

Das ist interessant. inline-block alleine tut es also wohl nicht, die Breite ist auch noch erforderlich(?) - erstaunlich nur, dass ausgerechnet so ein Element Opera dann hier veranlasst, um richtigen Moment eben doch die betroffenen Seitenbereiche neu darzustellen.
Na ja, manche Browser-Bugs kann man halt nicht von aussen logisch erklären.

Hier wäre auch Interessant zu wissen, ob es Betriebssystem-bedingt zu unterschieden kommen kann.

Das wäre generell noch denkbar -

Unter Linux/ Unix, Mac und Windows sicherlich, aber kann es auch unter Windows zu grossen unterschieden kommen (Win XP vs. Win 7)?

• aber innerhalb des selben Systems halte ich die Wahrscheinlichkeit für extrem gering.
  Die Rendering-Engine dürfte hier das verantwortliche Glied in Kette sein, und die dürfte sich von Version zu Version eines OS vermutlich (so gut wie) gar nicht unterscheiden.

MfG ChrisB

[Malcolm Beck´s]

hi,

Das ist interessant. inline-block alleine tut es also wohl nicht, die Breite ist auch noch erforderlich(?) -

Ein Element, dass inline-block ist, hat ja erstmal keine Breite; so ist es jedenfalls bei mir, daher kam ich auf width:100%;.

erstaunlich nur, dass ausgerechnet so ein Element Opera dann hier veranlasst, um richtigen Moment eben doch die betroffenen Seitenbereiche neu darzustellen.

Ich muss mich korrigieren, und es ist echt schwer zu erklären, was Opera da macht.

Es ist wie ein altbekannter Bug in den älteren IEs, wo man ein clearendes Element einfügen muss, damit ein gewisses Verhalten erzwungen wird (mir fällt gerade der Begriff nicht ein).
Opera erwartet etwas ähnliches; ein Element vor den Container, in dem hover:content vorkommt, also

<div:head>  
<clear:inline-block>  
<div:content>

Es funktioniert auch mit einem umschliessenden Element, dass inline-block ist.
Letztendlich läuft aber alles auf inline-block hinaus.

mfg