.nils: inline-element per css als block: Standardkonform?

Hallo,

Laut Html-Standard sollten Block-Elemente nicht innerhalb von Inline-Elementen vorkommen. Wie ist das, wenn ich ein span in einem Link per css zu einem Block-Element umdefiniere? Wird der Standard dann verletzt oder "gildet das"?

Gruß, Nils

  1. Hallo Nils.

    Laut Html-Standard sollten Block-Elemente nicht innerhalb von Inline-Elementen vorkommen.

    Korrekt, dies ist im HTML-Standard definiert.

    Wie ist das, wenn ich ein span in einem Link per css zu einem Block-Element umdefiniere? Wird der Standard dann verletzt oder "gildet das"?

    Natürlich ist dies in Ordnung, da du ja hiermit lediglich die Darstellung beeinflusst. Strukturell betrachtet bleibt ein Blockelement immer ein Blockelement und ein Inlineelement immer ein Inlineelement, daran ändert die jeweilige Darstellung nichts.

    Einen schönen Mittwoch noch.

    Gruß, Ashura

    --
    sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
    „It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
    [HTML Design Constraints: Logical Markup]
    1. Hallo Ashura,

      Danke für die schnelle Antwort :-)

      Gruß, Nils

  2. Hello out there!

    Laut Html-Standard sollten Block-Elemente nicht innerhalb von Inline-Elementen vorkommen. Wie ist das, wenn ich ein span in einem Link per css zu einem Block-Element umdefiniere? Wird der Standard dann verletzt oder "gildet das"?

    Ja, HTML und CSS sind völlig verschiedene Ebenen.

    Was in den Regeln der HTML-DTD %Block; bzw. %Inline; ist, hat mit CSS gar nichts zu tun.

    Und was im Browser-Stylesheet als Defaultwert der 'display'-Eigenschaft 'block' bzw. 'inline' ist, hat mit den Regeln der HTML-DTD nichts zu tun.

    Dass HTML-Block-Elemente üblicherweise mit 'display: block' formatiert werden und HTML-Inline-Elemente 'display: inline', ist sicher nicht zufällig, aber keineswegs zwingend.

    See ya up the road,
    Gunnar

    --
    “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
    1. Dann Frage ich micht aber, wie ein Browser

      <div style="display:block;border:1px solid red;">
          <div style="display:inline;border:1px solid green;">
              <span style="display:block;border:1px solid cyan;">
                  TEST
              </span>
          </div>
      </div>

      ... darstellen soll. Irgendwie erscheint mir das CSS ziemlich sinnlos/fehlerhaft. Meine Testbrowser liefern auch alle weder ein einheitliches noch ein halbwegs sinnvolles Ergebnis (das es vermutlich auch nicht gibt).

      Jonathan

      1. Hello out there!

        Irgendwie erscheint mir das CSS ziemlich sinnlos/fehlerhaft.

        Sinnlos vielleicht; fehlerhaft nein.

        Meine Testbrowser liefern auch alle weder ein einheitliches noch ein halbwegs sinnvolles Ergebnis (das es vermutlich auch nicht gibt).

        Aber ein richtiges. Wie das auszusehen hätte, ist aus 9.2 Kontrolle über das Erstellen von Boxen [CSS2] herauszulesen.

        See ya up the road,
        Gunnar

        --
        “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
        1. Aber ein richtiges. Wie das auszusehen hätte, ist aus 9.2 Kontrolle über das Erstellen von Boxen [CSS2] herauszulesen.

          Ah, danke, das wusste ich auch noch nicht.

          Zu meinem Testergebmis: Firefox und Opera machen es anscheinend richtig, Konqueror baut irgendeinen Mist mit den anonymen Boxen, die der ja eigentlich vor und nach dem block-span erstellen sollte (besonders, wenn diese noch Text enthalten, sonst lässt er die einfach weg), der IE6 dagegen scheint das inlide-div in das block-span hineinzukopieren. und macht etwa folgendes daraus:

          <div style="display:block;border:1px solid red;">
              <div style="display:inline;border:1px solid green;">
              </div>
                  <span style="display:block;border:1px solid cyan;">
                  <div style="display:inline;border:1px solid green;">
                      TEST
                  </div>
                  </span>
              <div style="display:inline;border:1px solid green;">
              </div>
          </div>

          wobei die beiden leeren divs nicht beachtet werden, wenn sie keinen Inhalt haben.