Nitnatsnok: Zugriff auf CSS-direktformatierte Elemente

Ich habe einen Code in folgendem Stile:

  
<div class="text">  
  <h2>xyz</h2>  
  <form action="" method="post">versch. inhalte</form>  
  <div>  
    <ul>blabla</ul>  
    <div style="float:left;">zu formatierender Inhalt</div>  
  </div>  
</div>

Ich arbeite an der Darstellungsänderung einer Website mittels Stylish und möchte den Inhalt des dritten <div> (also "zu formatierender Inhalt") formatieren - wie kann ich darauf zugreifen, wenn ich (logischerweise) keine IDs oder Klassennamen vergeben und mit div.text > div > div {...} das Element nicht eindeutig ansprechen kann (sprich es im Dokument weitere divs in dieser Konstellation gibt)?
Ich habe es schon mit den in der CSS-Kurzreferenz (http://de.selfhtml.org/navigation/css.htm#zentrale_formate) angegebenen Varianten probiert, nichts davon hat funktioniert:

  
div.text > div > div[style=float:left;]{...}  
div.text > div > div[style=float:left]{...}  
div.text > div > div[style='float:left']{...}  
div.text > div > div[style~=left]{...}  
div.text > div > div[style|=float]{...}  

Die Frage ist nun: Wie kann ich attributbedingt (da es ja leider nicht anders geht!) formatieren, wenn das Zugriffsattribut ein CSS-Attribut ist?
Es ist sehr schade, dass dieser Fall in der CSS-Kurzreferenz fehlt!

Ich hoffe, dass einer mein Problem anhand dieser Beschreibung versteht und mir helfen kann.
Gruß,
Nitnatsnok

  1. Ich machs mal kurz:

    div.text > div > div[style=float:left;]{...}

    Syntaxfehler, logisch in Ordnung.

    div.text > div > div[style=float:left]{...}

    Syntaxfehler und logischer Fehler.

    div.text > div > div[style='float:left']{...}

    Logischer Fehler, Syntax OK

    div.text > div > div[style~=left]{...}

    Logischer Fehler, Syntax OK

    div.text > div > div[style|=float]{...}

    Logischer Fehler, Syntax OK

    Es ist sehr schade, dass dieser Fall in der CSS-Kurzreferenz fehlt!

    Aber in der CSS-Spezifikation nicht.

  2. wie kann ich darauf zugreifen, wenn ich (logischerweise) keine IDs oder Klassennamen vergeben und mit div.text > div > div {...} das Element nicht eindeutig ansprechen kann (sprich es im Dokument weitere divs in dieser Konstellation gibt)?

    Nachtrag: es ist auch so wahrscheinlich problemlos möglich das betreffende ELement zu selektieren. Aber ohne das Dokument zu sehen wirds etwas schwierig :)

    1. Ich machs mal kurz:

      div.text > div > div[style=float:left;]{...}
      Syntaxfehler, logisch in Ordnung.

      div.text > div > div[style=float:left]{...}
      Syntaxfehler und logischer Fehler.

      div.text > div > div[style='float:left']{...}
      Logischer Fehler, Syntax OK

      div.text > div > div[style~=left]{...}
      Logischer Fehler, Syntax OK

      div.text > div > div[style|=float]{...}
      Logischer Fehler, Syntax OK

      Es ist sehr schade, dass dieser Fall in der CSS-Kurzreferenz fehlt!

      Aber in der CSS-Spezifikation nicht.

      Na also wo liegt denn nun deiner Meinung nach der logische Fehler?
      Eigentlich ist die Verschachtelung ja egal, wie ich die umsetzen kann ist klar, aber welche Variante (ob schon erwähnt oder nicht) ist denn nun richtig, wenn ich via CSS auf ein direktformatiertes Element zugreifen will?
      Ich dachte nicht, dass das so schwer wär... :(

      Nachtrag: es ist auch so wahrscheinlich problemlos möglich das betreffende ELement zu selektieren. Aber ohne das Dokument zu sehen wirds etwas schwierig :)

      Hm? Ich hab doch den betreffenden Ausschnitt gepostet? Reicht der nicht? Was willst du denn haben?

      1. Hi,

        Nachtrag: es ist auch so wahrscheinlich problemlos möglich das betreffende ELement zu selektieren. Aber ohne das Dokument zu sehen wirds etwas schwierig :)

        Hm? Ich hab doch den betreffenden Ausschnitt gepostet? Reicht der nicht? Was willst du denn haben?

        Das schrieb er doch explizit - wenn du "mehr" vom Dokumentaufbau drumherum (ggf. das ganze) zeigen würdest, dann fände sich eventuell(!) eine Möglichkeit, dass auch unkomplizierter zu lösen.

        MfG ChrisB

        --
        Light travels faster than sound - that's why most people appear bright until you hear them speak.
  3. @@Nitnatsnok:

    nuqneH

    div.text > div > div[style=float:left;]{...}
    div.text > div > div[style=float:left]{...}

    “Attribute values must be identifiers or strings.” [CSS21 §5.8.1] “Strings can either be written with double quotes or with single quotes.” [CSS21 §4.3.7]

    Das kann also wegen fehlender Anführungszeichen nicht gehen.

    div.text > div > div[style='float:left']{...}

    Sieht schon besser aus. Im Quelltext hattest du aber <div style="float:left;"> mit Semikolon.

    Wie dem auch sei: Browser haben ihre eigene interne Repräsentation von Inline-Styles. Firefox bspw. mit Leerzeichen nach dem Doppenpunkt und einem Semikolon am Ende; dieser Selektor greift:

    div.text > div > div[style='float: left;']{...}

    (Er würde auch greifen, wenn im HTML kein Semikolon stünde <div style="float:left">.)

    Andere Browser mögen da andere interne Repräsentationen haben, sodass dies wohl nicht browserübergreifend brauchbar ist.

    div.text > div > div[style~=left]{...}

    “Represents an element with the att attribute whose value is a white space-separated list of words […]” [CSS21 §5.8.1] "float:left;" ist keine Liste mit durch Leerzeichen voneinander getrennten Wörtern.

    (Allerdings ist es die interne Repräsentation im Firefox doch (s.o.), allerdings ist das zweite Wort "left;" mit Semikolon.

    div.text > div > div[style~="left;"]{...}

    funktioniert im Firefox. Häh? Was ist mit dem Doppelpunkt von "style:"?)

    div.text > div > div[style|=float]{...}

    “Represents an element with the att attribute, its value either being exactly "val" or beginning with "val" immediately followed by "-" (U+002D).” [CSS21 §5.8.1]

    Nach "style" steht kein "-" (U+002D). Das kann also nicht gehen.

    Dir genügt es also abzufragen, ob im 'style'-Attribut (als erstes) 'float' kommt? CSS 3 [CSS3-SELECTORS §6.3.2] bietet dazu einen geeigneten Attributselektor (den wohl auch alle Browser unterstützen, die überhaupt Attributselektoren unterstützen):

    div.text > div > div[style^="float"]{...}

    Wofür stehen eigentlich die drei Punkte? Du willst nicht etwa den Wert 'float'-Eigenschaft überschreiben? Wegen der Spezifität der Selektoren: keine Chance. [CSS21 §C.2.31]

    Qapla'

    --
    Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
    1. Hi,

      div.text > div > div[style~="left;"]{...}

      funktioniert im Firefox. Häh? Was ist mit dem Doppelpunkt von "style:"?)

      Welcher Doppelpunkt von Style?

      div.text > div > div[style|=float]{...}

      “Represents an element with the att attribute, its value either being exactly "val" or beginning with "val" immediately followed by "-" (U+002D).” [CSS21 §5.8.1]

      Nach "style" steht kein "-" (U+002D).

      Nach style soll auch keins stehen, denn style ist das att attribute, und das "-" ist auf value bezogen.
      Funktioniert hier also auch nicht, weil hinter dem float kein - kommt; aber eben aus anderem Grund.

      MfG ChrisB

      --
      Light travels faster than sound - that's why most people appear bright until you hear them speak.
      1. @@ChrisB:

        nuqneH

        Was ist mit dem Doppelpunkt von "style:"?)
        Welcher Doppelpunkt von Style?

        Geistige Umnachtung, "style" und "float" verwechselt. Ich meinte den von "float:", der natürlich hier irrelevant ist.

        Nach style soll auch keins stehen […]
        Funktioniert hier also auch nicht, weil hinter dem float kein - kommt

        Geistige Umnachtung 2 …

        Qapla'

        --
        Alle Menschen sind klug. Die einen vorher, die anderen nachher. (John Steinbeck)
    2. Ach wieder diese blöden Anführungszeichen...
      Besser hättest du mir nicht helfen können - Ich danke dir!
      Grüße, Nitnatsnok

    3. Dhùmílánì!

      Wofür stehen eigentlich die drei Punkte? Du willst nicht etwa den Wert 'float'-Eigenschaft überschreiben? Wegen der Spezifität der Selektoren: keine Chance. [CSS21 §C.2.31]

      Mit !important geht’s.

      Viele Grüße vom Længlich

      --
      Mein aktueller Gruß ist:
      Kalanga (gesprochen in Botswana und Zimbabwe)