sunny: Spezielle Klasse für Opera?

Hallo!

Es gibt ja die Möglichkeit bei divs die mit einer id versehen sind eigene Eigenschaften für Opera festzulegen:

html > body > #div {
 ...
}

Allerdings, funktioniert das auch bei Klassen? Ich hab nämlich ein Element (ein div), das mehrmals auf der Seite vorkommt, also kann ich keine id verwenden sondern sollte eine Klasse definieren. Gibt es da auch eine Möglichkeit spezifische Angaben für Opera zu machen?

Leider stellt Opera (6.05) nämlich diese divs nicht ganz richtig dar, in IE, Mozilla, Netscape usw. klappts ...

Lg,
sunny

  1. Hallo sunny,

    Es gibt ja die Möglichkeit bei divs die mit einer id versehen sind eigene Eigenschaften für Opera festzulegen:

    html > body > #div {
    ...
    }

    Allerdings, funktioniert das auch bei Klassen?

    Und was hast Du es schon versucht?
    Was war Dein Ergebnis?
    Hast Du bedacht, daß obigen selektorhack auch Mozilla kann?
    Hast Du bedacht, daß damit für Mozilla noch ein zusätzlicher selektorhack nötig ist?
    Lohnt sich der Aufwand wirklich?

    Grüße aus Nürnberg,
    HarryS

    1. Hi Harry,

      Es gibt ja die Möglichkeit bei divs die mit einer id versehen sind eigene Eigenschaften für Opera festzulegen:

      html > body > #div {
      ...
      }

      Allerdings, funktioniert das auch bei Klassen?

      Und was hast Du es schon versucht?

      Ähm ... ich habs einfach mal so wie oben nur halt mit einer Klasse versucht, aber wie ich es mir gedacht hatte geht das so nicht.
      Meine Frage war eigentlich nur ob es eine Möglichkeit gibt, da mir keine bekannt ist und ich auch nichts dazu gefunden hab.

      Was war Dein Ergebnis?

      Keines bisher. Leider.

      Hast Du bedacht, daß obigen selektorhack auch Mozilla kann?
      Hast Du bedacht, daß damit für Mozilla noch ein zusätzlicher selektorhack nötig ist?

      2x ja. Mozilla würde dann darunter wieder die normalen Definitionen (head:first-child + body > #div {normale styles}) kriegen, er hat keine Probleme damit.

      Lohnt sich der Aufwand wirklich?

      Zumindest würde ich dann eine korrekte Darstellung auch in Opera erreicht, was sehr wünschenswert wäre. Aber wie gesagt, ich weiß leider nicht ob es möglich ist. Daher auch meine Frage hier.

      Liebe Grüße,
      sunny

      1. Hallo sunny,

        Aaaalso ich hab jetzt auch 'n bisschen damit rumexperimentiert und folgendes hat bei mir funktioniert:
        <style type="text/css">
          html>body>.eins {color:blue;}  /*für Opera, Mozi und NS6+ Achtung: Schreibweise genau so, sonst geht es nicht*/
          html:root .eins {color:magenta;} /* das kapiert nur Mozi und NS6+ Achtung: Schreibweise genau so, (mit dem leerzeichen) sonst geht es nicht*/
        </style>

        und im body halt dann z.B.
          <div class="eins">Ein div, in Opera Blau in Mozi violett</div>
          <p class="eins">dieser p ist in Opera Blau in Mozi violett</p>

        Meine Frage war eigentlich nur ob es eine Möglichkeit gibt, da mir keine bekannt ist und ich auch nichts dazu gefunden hab.

        Was war Dein Ergebnis?
        Keines bisher. Leider.

        Och das ist aber schade, versuchs doch mal mit meinem Beispiel.

        Hast Du bedacht, daß obigen selektorhack auch Mozilla kann?
        Hast Du bedacht, daß damit für Mozilla noch ein zusätzlicher selektorhack nötig ist?
        2x ja. Mozilla würde dann darunter wieder die normalen Definitionen (head:first-child + body > #div {normale styles}) kriegen, er hat keine Probleme damit.

        Alles klar, sehe schon Du weist bescheid. Übrigens das mit "html:root .classname" oder #divname usw. hab ich von Orlando und funktioniert prima.

        Lohnt sich der Aufwand wirklich?
        Zumindest würde ich dann eine korrekte Darstellung auch in Opera erreicht, was sehr wünschenswert wäre. Aber wie gesagt, ich weiß leider nicht ob es möglich ist. Daher auch meine Frage hier.

        Hmmmm Opera(zumindest ab 6) und Mozilla sind doch eigentlich auf gleicher Linie, aber Du wirst wohl Deine Gründe haben. Also falls es bei dir mit meinem Beispiel nicht funktioniert meld dich halt nochmal.

        Grüße aus Nürnberg,
        HarryS

        1. Hallo Harry!

          Aaaalso ich hab jetzt auch 'n bisschen damit rumexperimentiert und folgendes hat bei mir funktioniert:
          <style type="text/css">
            html>body>.eins {color:blue;}  /*für Opera, Mozi und NS6+ Achtung: Schreibweise genau so, sonst geht es nicht*/
            html:root .eins {color:magenta;} /* das kapiert nur Mozi und NS6+ Achtung: Schreibweise genau so, (mit dem leerzeichen) sonst geht es nicht*/
          </style>

          und im body halt dann z.B.
            <div class="eins">Ein div, in Opera Blau in Mozi violett</div>
            <p class="eins">dieser p ist in Opera Blau in Mozi violett</p>

          Wow - super! Das funktioniert bei mir auch!

          Alles klar, sehe schon Du weist bescheid. Übrigens das mit "html:root .classname" oder #divname usw. hab ich von Orlando und funktioniert prima.

          Ja Orlando hat mir bei meinen CSS-Problemchen auch schon oft geholfen! :)

          Nur leider funktioniert das Ganze bei meiner Seite nicht. Obwohl ich mir zu 99% (muss wohl Betriebsblindheit sein) sicher bin, dass ich es genauso gemacht hab wie in dem Beispiel von Dir, das bei mir auch funktioniert.

          Kannst Du da den Fehler entdecken? Ich habs jetzt ungefähr 10 x neu geschrieben ... ;)

          Styles:

          .promobox {
           width:234px;
           height:146px;
           float:left;
           background-image:url(images/promobox_bg.gif);
           padding-right:5px;
           overflow:hidden;
           margin-bottom:15px;
          }

          html>body>.promobox {
          /* für Opera, Mozi und NN6 */
           width:234px;
           height:146px;
           float:left;
           background-image:url(images/opera_bg.gif);
           padding-right:5px;
           overflow:hidden;
           margin-bottom:15px;
           border:1px solid black;
          }

          html:root .promobox {
          /* für Mozi und NN6 */
           width:234px;
           height:146px;
           float:left;
           background-image:url(images/promobox_bg.gif);
           padding-right:5px;
           overflow:hidden;
           margin-bottom:15px;
          }

          Die divs beinhalten nichts besonderes, nur Text im Grunde.
          Ich möchte für Opera kein, oder ein anderes Hintergrundbild haben. Zur Kennzeichnung, damit ich sehe ob es funktioniert, hab ich einfach mal dem style für Opera noch einen border zugewiesen, der wird aber auch nicht angezeigt, irgendwie verwendet er nicht die richtigen Angaben. Was hab ich denn jetzt falschgemacht?

          Danke für Deine super Hilfe und dass Du Dir die Mühe gemacht hast das für mich auszuprobieren! Vielleicht siehst Du ja den Fehler sofort, Du sitzt ja noch nicht tagelang vor denselben styles! :)

          Lg,
          sunny

          1. Hallo sunny,

            Nur leider funktioniert das Ganze bei meiner Seite nicht. Obwohl ich mir zu 99% (muss wohl Betriebsblindheit sein) sicher bin, dass ich es genauso gemacht hab wie in dem Beispiel von Dir, das bei mir auch funktioniert.
            Kannst Du da den Fehler entdecken? Ich habs jetzt ungefähr 10 x neu geschrieben ... ;)

            Ja das kenn ich *hehehe*
            Also auf Anhieb find ich nix...

            Ich hab dein stylesheet jetzt mal in meinen Editor einfach mit C&P eingefügt und 3 eigene Bilder als Hintergrund genommen, und halt Dich fest, es hat alles funktioniert. (Opera 5 und 6 und Mozi 1.1 auf winXP).

            Ich hab noch weiterprobiert, und wie zu erwarten, kann man alles redundante rausnehmen (hab zu testen bloß mal die Border etwas dicker gemacht):

            <style type="text/css">
            .promobox {
             width:234px;
             height:146px;
             float:left;
             background-image:url(blau.gif);
             padding-right:5px;
             overflow:hidden;
             margin-bottom:15px;
             border:10px solid blue;
            }

            html>body>.promobox {
            /* für Opera, Mozi und NN6 */
             background-image:url(rot.gif);
             border:10px solid red;
            }

            html:root .promobox {
            /* für Mozi und NN6 */
             background-image:url(gruen.gif);
             border:10px solid green;
            }
            </style>

            Die divs beinhalten nichts besonderes, nur Text im Grunde.
            Ich möchte für Opera kein, oder ein anderes Hintergrundbild haben. Zur Kennzeichnung, damit ich sehe ob es funktioniert, hab ich einfach mal dem style für Opera noch einen border zugewiesen, der wird aber auch nicht angezeigt, irgendwie verwendet er nicht die richtigen Angaben. Was hab ich denn jetzt falschgemacht?

            Da fällt mir auch nix mehr zu ein :(

            Hmmm eine Möglichkeit gibts vielleicht noch:
            Es soll Browserversionen geben die es nicht mögen, wenn ein /*kommentar*/ innerhalb der CSS-Definition steht. Also am besten vor das Format schreiben. Es gibt sogar nen hack der sowas ähnliches ausnutzt.

            Beispiel:
            html>body #divname {/*/*//*/background-color:yellow;/* */}
            das versteht nur Opera5, seltsam oder?

            Falls es immer noch nicht klappt, kannst Du deine Datei mal online stellen? Es soll Fehler geben, die nur lokal existieren.

            Grüße aus Nürnberg,
            HarryS

            1. Hallo Harry!

              Ich hab dein stylesheet jetzt mal in meinen Editor einfach mit C&P eingefügt und 3 eigene Bilder als Hintergrund genommen, und halt Dich fest, es hat alles funktioniert. (Opera 5 und 6 und Mozi 1.1 auf winXP).

              Ich hab noch weiterprobiert, und wie zu erwarten, kann man alles redundante rausnehmen (hab zu testen bloß mal die Border etwas dicker gemacht):

              <style type="text/css">
              .promobox {
               width:234px;
               height:146px;
               float:left;
               background-image:url(blau.gif);
               padding-right:5px;
               overflow:hidden;
               margin-bottom:15px;
               border:10px solid blue;
              }

              html>body>.promobox {
              /* für Opera, Mozi und NN6 */
               background-image:url(rot.gif);
               border:10px solid red;
              }

              html:root .promobox {
              /* für Mozi und NN6 */
               background-image:url(gruen.gif);
               border:10px solid green;
              }
              </style>

              Und ich hab per Copy & Paste genau Deinen Code in meinen Editor eingefügt und es funktioniert nicht. Mozi machts korrekt, Opera nicht. WinXP, Opera 6.05. Das gibts doch nicht ...
              Ich hab jetzt das Ding mal hochgeladen, allerdings gibts bei meinem gratis-Webspace keinen FTP-Upload, darum fehlen alle Bilder ... aber das Problem müsste trotzdem zu erkennen sein, hab die border für Opera auf rot gestellt, sie sind aber wie beim IE blau. Nur zum Testen.

              Und bitte bedenke, das Ding ist noch in Arbeit, das heißt da sind sicher noch einige Fehler drinnen (so wie die Redundanz in den styles die ich im Eifer des Gefechts ganz vergessen hatte wegzulöschen) usw. Muss über den ganzen Code am Schluss nochmal drüberschauen (gibt ja auch den Validator ;) ) ... es sind sicher ein paar Fehlerchen drin ...

              Da fällt mir auch nix mehr zu ein :(

              Na vielleicht aber wenn Du das Problem siehst - hoffentlich siehst Du es wenigstens - nicht dass es bei Dir wieder funktioniert!

              Hmmm eine Möglichkeit gibts vielleicht noch:
              Es soll Browserversionen geben die es nicht mögen, wenn ein /*kommentar*/ innerhalb der CSS-Definition steht. Also am besten vor das Format schreiben. Es gibt sogar nen hack der sowas ähnliches ausnutzt.

              Das hab ich probiert, hat nichts geändert.

              Beispiel:
              html>body #divname {/*/*//*/background-color:yellow;/* */}
              das versteht nur Opera5, seltsam oder?

              Wow - wie kommt jemand auf solche Dinge ... ;)

              Falls es immer noch nicht klappt, kannst Du deine Datei mal online stellen? Es soll Fehler geben, die nur lokal existieren.

              Hab ich gemacht, ist leider nicht ganz optimal so ohne Bilder und so ... aber vielleicht hilfts!

              Danke für Deine tolle Hilfe bisher,
              liebe Grüße,
              Simone

              1. Hallo sunny,

                Und ich hab per Copy & Paste genau Deinen Code in meinen Editor eingefügt und es funktioniert nicht. Mozi machts korrekt, Opera nicht. WinXP, Opera 6.05. Das gibts doch nicht ...

                Hmmmmm seeeehr seltsam.

                Ich hab jetzt das Ding mal hochgeladen, allerdings gibts bei meinem gratis-Webspace keinen FTP-Upload, darum fehlen alle Bilder ... aber das Problem müsste trotzdem zu erkennen sein, hab die border für Opera auf rot gestellt, sie sind aber wie beim IE blau. Nur zum Testen.

                Und bitte bedenke, das Ding ist noch in Arbeit, das heißt da sind sicher noch einige Fehler drinnen (so wie die Redundanz in den styles die ich im Eifer des Gefechts ganz vergessen hatte wegzulöschen) usw. Muss über den ganzen Code am Schluss nochmal drüberschauen (gibt ja auch den Validator ;) ) ... es sind sicher ein paar Fehlerchen drin ...

                Ähem, entweder ich hab Tomaten auf meinen Pupillen oder Du hast einen Link zu Deiner Page vergessen ;o)

                Es soll Browserversionen geben die es nicht mögen, wenn ein /*kommentar*/ innerhalb der CSS-Definition steht. Also am besten vor das Format schreiben. Es gibt sogar nen hack der sowas ähnliches ausnutzt.
                Das hab ich probiert, hat nichts geändert.

                Schade wär ja auch zu einfach gewesen.

                Beispiel:
                html>body #divname {/*/*//*/background-color:yellow;/* */}
                das versteht nur Opera5, seltsam oder?
                Wow - wie kommt jemand auf solche Dinge ... ;)

                Hihi genau das gleiche hab ich mich auch gefragt. Ist aber leider nicht von mir. Hab's bei http://centricle.com/ref/css/filters/ gefunden.

                Falls es immer noch nicht klappt, kannst Du deine Datei mal online stellen? Es soll Fehler geben, die nur lokal existieren.
                Hab ich gemacht, ist leider nicht ganz optimal so ohne Bilder und so ... aber vielleicht hilfts!

                Ja aber wie komm ich denn jetzt bloß auf Deine Seite *hilfeeeee*

                Danke für Deine tolle Hilfe bisher,

                Och keine Ursache ist doch gern geschehen :)

                Grüße aus Nürnberg,
                HarryS

                1. Ähem, entweder ich hab Tomaten auf meinen Pupillen oder Du hast einen Link zu Deiner Page vergessen ;o)

                  Oh weh ... sorry ... ich mach eindeutig zu viele Dinge gleichzeitig ... und mal wieder schlafen wär ganz gut! ;-)

                  Hier der Link: http://www33.brinkster.com/enomis/operaproblem/de/folder/index/index.asp

                  Lg,
                  sunny

                  1. Hallo sunny,

                    Aaaaaaaaaaaaahaaaaaaaaaaaa, jetzt ist alles klar *froi*.
                    Der Selektorhack funktioniert nicht, wenn das mit der class (hier .promobox) formatierte div in einem anderen div steckt.
                    setz mal testhalber ein  .promobox div direkt unter <body> dann siehst Du das klappt und es wird mit einem roten rahmen angezeigt.

                    Das kommt daher daß das > in CSS ja eine echte Bedeutung hat:
                    Das Größer-als-Zeichen (>) verbindet zwei Elemente. Es bezeichnet dabei das zweite Element, wenn es "Kind" des ersten Elements ist. Beispiel:
                    OL > LI { ... }
                    /*Alle Li, wenn sie "Kind(er)" von OL sind*/

                    In deinem Beispiel ist .promobox kind von body mit html als Eltern.
                    Desshalb funktioniert es nicht, wenn nochmal ein kind(div) dazwischen ist. (ähem, ist jetzt vielleicht etwas konfus ausgedrückt)

                    Das heißt, Du musst _alle_ Eltern und Kinder angeben :)
                    Nachdem Dein Projekt doch ziemlich umfangreich ist hab ich jetzt nicht alle divs die ineinander verschachtelt sind auseinandergefieselt (BTW bist Du eigentlich auch Truckerin?)

                    Aber dafür hier ein einfaches Beispiel (Hab jetzt mal alles unwichtige weggelassen):

                    <style>
                    html>body>#eins>.zwei>.drei {
                    /* für Opera, Mozi und NN6 */
                     background-image:url(rot.gif);
                     border:10px solid red;
                    }
                    </style>

                    <html>
                      <body>
                        <div id="eins">
                          <div class="zwei">
                            <div class="drei">Opera in rot</div>
                          </div>
                        </div>
                      </body>
                    </html>

                    Uff, ich hoffe das hilft Dir jetzt bei deinem Projekt und alle Klarheiten sind beseitigt.

                    Grüße aus Nürnberg,
                    HarryS

                    1. Hallo Harry!

                      Aaaaaaaaaaaaahaaaaaaaaaaaa, jetzt ist alles klar *froi*.
                      Der Selektorhack funktioniert nicht, wenn das mit der class (hier .promobox) formatierte div in einem anderen div steckt.
                      setz mal testhalber ein  .promobox div direkt unter <body> dann siehst Du das klappt und es wird mit einem roten rahmen angezeigt.

                      Das kommt daher daß das > in CSS ja eine echte Bedeutung hat:
                      Das Größer-als-Zeichen (>) verbindet zwei Elemente. Es bezeichnet dabei das zweite Element, wenn es "Kind" des ersten Elements ist.

                      Na Mensch dass ich da ned selber draufgekommen bin, das ist ja total logisch ... das konnte ja wirklich gar nicht funktionieren! Ich kanns zwar im Moment nicht ausprobieren, aber ich bin mir ziemlich sicher dass ich das jetzt hinkriege! Na echt ein blöder Fehler ... ;-)

                      (ähem, ist jetzt vielleicht etwas konfus ausgedrückt)

                      Nö nö - hab alles verstanden!

                      (BTW bist Du eigentlich auch Truckerin?)

                      Naaaa! Das nicht!
                      Es ist kein privates Projekt von mir ... ich arbeite in einer Agentur und dieses Projekt ist für Mercedes-Benz Österreich.

                      Uff, ich hoffe das hilft Dir jetzt bei deinem Projekt und alle Klarheiten sind beseitigt.

                      Ja super Du hast mir echt weitergeholfen!
                      Allerdings gibt es noch ein (anderes) riesiges Problem mit Netscape 4.x. Hab dazu zwar schon einmal gepostet, aber keine wirklich zielführenden Antworten erhalten. Ich werds nochmal versuchen, wenn Du magst könntest Dir das auch mal anschauen - das wär echt lieb! Scheinst ja echt super zu sein was CSS betrifft!

                      Also jedenfalls schick ich Dir hiermit ein ganz großes "DANKESCHÖN" (in dem Fall darf ich Großbuchstaben schreiben, gell!) an Dich! Für die Geduld und die Hilfe! :-)

                      Liebe Grüße aus Salzburg,
                      sunny

                      1. Hallo sunny

                        Allerdings gibt es noch ein (anderes) riesiges Problem mit Netscape 4.x. Hab dazu zwar schon einmal gepostet, aber keine wirklich zielführenden Antworten erhalten. Ich werds nochmal versuchen, wenn Du magst könntest Dir das auch mal anschauen - das wär echt lieb! Scheinst ja echt super zu sein was CSS betrifft!

                        Naja man liest hier und da, probiert dies und das, und besucht natürlich regelmäßig hier das Forum, da kann man fast alles drüber lernen.

                        Meinst Du jetzt NS4 und dieses Projekt? Also mit NS4 bin ich ehrlich gesagt nicht so der Crack, (bei mir bekommt er immer nur eine sehr rudimentäre eigene *.css mit dem allernötigsten, und das kann er dann meistens auch) aber Cyx23 ist _der_ Spezialist für dieses Browserunglück. (heißer Tip: Selfsuche und "author:Cyx23" eingeben). Aber ich werds bestimmt anschauen.

                        Also jedenfalls schick ich Dir hiermit ein ganz großes "DANKESCHÖN" (in dem Fall darf ich Großbuchstaben schreiben, gell!) an Dich! Für die Geduld und die Hilfe! :-)

                        Oh das tut meiner Seele gut :o) freut mich, daß wir das kleine Problem beseitigen konnten. Bei dem Riesending das Du da in Arbeit hast bist Du sicher noch einige Zeit beschäftigt. Noch viel Erfolg dazu.

                        Grüße aus Nürnberg,
                        HarryS

                        1. Hallo Harry!

                          Naja man liest hier und da, probiert dies und das, und besucht natürlich regelmäßig hier das Forum, da kann man fast alles drüber lernen.

                          Das stimmt! Meine Kenntnisse die ich hab was CSS betrifft hab ich auch alle fast ausschließlich aus Selfhtml und dem Forum hier! Hier lernt man wirklich viel! :)
                          An dieser Stelle kann ich nur sagen - schön dass es dieses Projekt hier gibt!

                          Meinst Du jetzt NS4 und dieses Projekt?

                          Ja leider leider sollte es auch in Netscape 4.7 ziemlich gut aussehen. Aber ich wollte einfach nicht mit tausenden von verschachtelten Tabellen arbeiten ... auch wenn der alte NN sich da viel leichter tut.

                          Also mit NS4 bin ich ehrlich gesagt nicht so der Crack, (bei mir bekommt er immer nur eine sehr rudimentäre eigene *.css mit dem allernötigsten, und das kann er dann meistens auch)

                          Privat mach ich das auch immer so! Eine "Lightversion" muss da reichen ;)

                          aber Cyx23 ist _der_ Spezialist für dieses Browserunglück. (heißer Tip: Selfsuche und "author:Cyx23" eingeben).

                          Er hat sich das schon angeschaut und damals auch auf mein Posting geantwortet, aber leider bin ich trotzdem nicht auf eine Lösung gekommen.

                          Aber ich werds bestimmt anschauen.

                          Dankeschön!
                          Hab bereits gepostet, hoffentlich komme ich diesmal weiter, es wär echt wichtig ... na ja, sein eigenes Problem ist hier wohl für jeden wichtig! Aber schön langsam bin ich echt am Verzweifeln was NN 4.7 und mein CSS betrifft ...

                          Oh das tut meiner Seele gut :o) freut mich, daß wir das kleine Problem beseitigen konnten.

                          Ja mich auch - sehr sogar! :)

                          Bei dem Riesending das Du da in Arbeit hast bist Du sicher noch einige Zeit beschäftigt.

                          Da hast Du ganz sicher Recht!

                          Noch viel Erfolg dazu.

                          Danke!

                          Sonnige Grüße aus Salzburg!

                          sunny