Konrad L. M. Rudolph: <span> rechts ausrichten

Moin,

gegeben sei folgendes Markup:

\\ <h2>Neues Auto <span class="date">19/02/1985</date></h2>
///

Wie (wenn überhaupt) bekomme ich es hin, dass der <span> rechts im <h2>-Element ausgerichtet ist (<h2> hat feste Breite)?

Mit float komme ich hier ja leider nicht weiter, es sei denn, ich packe den Text vor dem Datum ebenfalls in einen <span>. Im Archiv habe ich nichts gefunden.

Gruß,
KonRad -

--
»Choose life.« - Trainspotting, drug addict
»Choose life.« - Deuteronomy 30.19, GOD
  1. Hi,

    <h2>Neues Auto <span class="date">19/02/1985</date></h2>

    das </date> soll hoffentlich </span> heißen :-)

    Mit float komme ich hier ja leider nicht weiter, es sei denn, ich packe den Text vor dem Datum ebenfalls in einen <span>.

    float ist exakt das Richtige. Wieso macht es bei Dir Probleme? Ggf. könntest Du mit position arbeiten.

    Cheatah

    --
    X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
    X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
    X-Will-Answer-Email: No
    X-Please-Search-Archive-First: Absolutely Yes
    1. hi

      float ist exakt das Richtige. Wieso macht es bei Dir Probleme? Ggf. könntest Du mit position arbeiten.

      bei mir macht der aber bei float vorher einen zeilenumbruch, also auch nicht ganz korrekt.
      habs auch mit display:inline; versucht, klappt aber auch nicht...

      hier der code:
      <html>
      <head>
      <title>test</title>
      </head>
      <body>
      <h2 width=500 style='display:inline;'>Test<span style='float:right;'>Temp</span></h2>
      </body>
      </html>

      thomas

      1. Moin moin

        Meiner Ansicht nach ist der Ansatz bereits falsch (auch wenn das Problem an anderer Stelle mal interessnat sein könnte). Hier solltest du das Datum tatsächlich außerhalb von <h1></h1> verwenden - ein Datum ist doch keine Überschrift - es sei denn es stünde über einer Tabellenspalte - aber das scheint hier doch nicht der Fall zu sein.

        <h1>&Uuml;berschrift</h1>
        <p style="float:right;">1.1.1900</p>

        Sollte dann problemlos funktionieren...

        Gruß,
        Marc.

        --
        sh:( fo:| ch:? rl:? br:> n4:& ie:% mo:} va:} de:] zu:) fl:( ss:| ls: js:(
        http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A%28+fo%3A%7C+ch%3A%3F+rl%3A%3F+br%3A%3E+n4%3A%26+ie%3A%25+mo%3A%7D+va%3A%7D+de%3A%5D+zu%3A%29+fl%3A%28+ss%3A%7C+ls%3A+js%3A%28
        1. Moin moin

          Meiner Ansicht nach ist der Ansatz bereits falsch (auch wenn das Problem an anderer Stelle mal interessnat sein könnte). Hier solltest du das Datum tatsächlich außerhalb von <h1></h1> verwenden

          Nun, das stimmt, aber ich schreibe CSS für mein Markup, nicht umgekehrt Markup, das gut formatiert werden kann.

          ein Datum ist doch keine Überschrift

          Doch, schon. Das ganze ist eine (News-)Auflistung. Ein <li> enthält einen Titel inklusive Datum und einen Textkörper. Die Struktur sieht damit so aus:

          \\ <ul>
              <li>
                  <h2>... <span class="datum"/></h2>
                  <div>
                      <p/>
                  </div>
              </li>
          </ul>
          ///

          Gruß,
          KonRad -

          --
          »Choose life.« - Trainspotting, drug addict
          »Choose life.« - Deuteronomy 30.19, GOD
          1. Moin moin

            Meiner Ansicht nach ist der Ansatz bereits falsch (auch wenn das Problem an anderer Stelle mal interessnat sein könnte). Hier solltest du das Datum tatsächlich außerhalb von <h1></h1> verwenden

            Nun, das stimmt, aber ich schreibe CSS für mein Markup, nicht umgekehrt Markup, das gut formatiert werden kann.

            Das ist ja auch richtig so.

            Ein üblicher Artikel-Aufbau wäre aber ungefähr folgender:

            ---------8<----------------------------------------

            <h1>Site-Bezeichnung</h1>

            <h2>Seiten-Titel</h2>

            <h3>Überschrift erster Artikel</h3>            vom: Datum
            -----------------------------------            Autor: Name

            <h4>Untertitel des ersten Artikels</h4>

            Beitratstext Beitratstext Beitratstext Beitratstext
            Beitratstext Beitratstext Beitratstext Beitratstext
            Beitratstext Beitratstext Beitratstext
            Beitratstext Beitratstext Beitratstext Beitratstext
            Beitratstext Beitratstext

            Fazit:
            Beitratstext Beitratstext Beitratstext Beitratstext
            Beitratstext Beitratstext

            -------------------->8----------------------------------------

            Wobei die Überschrift sinnvollerweise niemals <h1> sein kann, also eine Überschrift ERSTER Ordnung. Womit willst Du sonst den Titel Deiner Website formatieren? Und den Titel der einzelnen Seiten?

            ein Datum ist doch keine Überschrift

            Doch, schon. Das ganze ist eine (News-)Auflistung. Ein <li> enthält einen Titel inklusive Datum und einen Textkörper. Die Struktur sieht damit so aus:

            \\ <ul>
                <li>
                    <h2>... <span class="datum"/></h2>
                    <div>
                        <p/>
                    </div>
                </li>
            </ul>
            ///

            Naja, ist natürlich Deine Sache, aber ich würde so etwas nicht mit Listen machen - lass das mal einem Blinden von einem Screenreader vorlesen...

            Gruß,
            Marc.

            --
            sh:( fo:| ch:? rl:? br:> n4:& ie:% mo:} va:} de:] zu:) fl:( ss:| ls: js:(
            http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A%28+fo%3A%7C+ch%3A%3F+rl%3A%3F+br%3A%3E+n4%3A%26+ie%3A%25+mo%3A%7D+va%3A%7D+de%3A%5D+zu%3A%29+fl%3A%28+ss%3A%7C+ls%3A+js%3A%28
            1. Moin,

              Naja, ist natürlich Deine Sache, aber ich würde so etwas nicht mit Listen machen - lass das mal einem Blinden von einem Screenreader vorlesen...

              Hmm, womit denn sonst? Kurz-News sind doch logischer Weise eine Auflistung. Ich habe leider keinen Screenreader zum Testen aber IMHO sollte das kohärent ausgegeben werden.

              Gruß,
              KonRad -

              --
              »Choose life.« - Trainspotting, drug addict
              »Choose life.« - Deuteronomy 30.19, GOD
              1. Moin moin> Moin,

                Naja, ist natürlich Deine Sache, aber ich würde so etwas nicht mit Listen machen - lass das mal einem Blinden von einem Screenreader vorlesen...

                Hmm, womit denn sonst? Kurz-News sind doch logischer Weise eine Auflistung. Ich habe leider keinen Screenreader zum Testen aber IMHO sollte das kohärent ausgegeben werden.

                Liest der nicht auch jedesmal vor, dass jetzt ein neuer Listeneintrag kommt? Das nervt doch.

                Ein Auflistung wären IMHO (jetzt ist es aber echt offtopic und nur noch ein Meinungsaustausch) lediglich die Nennung der Artikel (also eine AUFZÄHLUNG der Titel).

                Du meinst sicher so etwas wie auf http:www.heise.de/. Obwohl die Ihre Übersicht sogar im HTML-Kommentar als "Liste" bezeichnen, verwenden die kein.

                Wozu auch?

                Eine Liste macht nur dann Sinn, wenn man auch Listenpunkte vor jeden Listeneintrag setzen kann (auch wenn man die aus optischen Gründen manchmal entfernt).

                So kann man zwar ein Menü so formatieren, dass die Punkte nicht angezeigt werden, aber da es wirklich eine Auflistung von Links ist, würden die Punkte nicht wirklich stören.

                Aber vor jeder Überschrift einen Listenpunkt? - Sähe doch komisch aus, oder?

                Hier noch ein paar Beispiel von Seiten mit Teaser-Texten:

                Keiner benutzt hierfür Listen...

                Gruß,
                Marc.

                --
                sh:( fo:| ch:? rl:? br:> n4:& ie:% mo:} va:} de:] zu:) fl:( ss:| ls: js:(
                http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A%28+fo%3A%7C+ch%3A%3F+rl%3A%3F+br%3A%3E+n4%3A%26+ie%3A%25+mo%3A%7D+va%3A%7D+de%3A%5D+zu%3A%29+fl%3A%28+ss%3A%7C+ls%3A+js%3A%28
                1. Hallo.

                  Eine Liste macht nur dann Sinn, wenn man auch Listenpunkte vor jeden Listeneintrag setzen kann (auch wenn man die aus optischen Gründen manchmal entfernt).

                  So kann man zwar ein Menü so formatieren, dass die Punkte nicht angezeigt werden, aber da es wirklich eine Auflistung von Links ist, würden die Punkte nicht wirklich stören.

                  Aber vor jeder Überschrift einen Listenpunkt? - Sähe doch komisch aus, oder?

                  Nein, Unter der Überschrift "Nachrichten" ist jede einzelne Meldung ein Bestandteil einer Liste. Die Formatierung obliegt HTML ja nicht.

                  Keiner benutzt hierfür Listen...

                  Das Netz ist voll mit Gegenbeispielen.
                  MfG, at

                  1. Hi,

                    Nein, Unter der Überschrift "Nachrichten" ist jede einzelne Meldung ein Bestandteil einer Liste. Die Formatierung obliegt HTML ja nicht.

                    Es kommt immer auch auf die Sichtweise an. Ich könnte auch sagen:
                    Ein Roman besteht aus einer Liste von Kapiteln, welche wiederum aus Listen von Absätzen bestehen.

                    cu,
                    Andreas

                    --
                    MudGuard? Siehe http://www.Mud-Guard.de/
                    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
                    1. Hallo.

                      Nein, Unter der Überschrift "Nachrichten" ist jede einzelne Meldung ein Bestandteil einer Liste. Die Formatierung obliegt HTML ja nicht.

                      Es kommt immer auch auf die Sichtweise an. Ich könnte auch sagen:
                      Ein Roman besteht aus einer Liste von Kapiteln, welche wiederum aus Listen von Absätzen bestehen.

                      Es steht dir frei, das zu tun; ich tue es nicht.
                      Mir ging es darum, den Gedanken auszuräumen, eine Liste wäre im geschilderten Fall per se nicht nachzuvollziehen, mithin unsinnig.
                      MfG, at

            2. Hallo Marc,

              Wobei die Überschrift sinnvollerweise niemals <h1> sein kann, also eine Überschrift ERSTER Ordnung. Womit willst Du sonst den Titel Deiner Website formatieren? Und den Titel der einzelnen Seiten?

              Gibt es dazu irgendwo Empfehlungen? Also Antworten auf Fragen wie

              • Darf/Muss eine HTML-Seite genau 1x <h1> enthalten?
              • Ist es erlaubt, in einem HTML-Dokument <h1> für einen Menübereich und gleichzeitig für einen Inhaltsbereich anzugeben?

              In der Doku des W3 steht leider nur, dass <h1> bis <h6> Überschriften sind und zur Strukturierung verwendet werden sollen.

              Viele Grüße
              Frank

              1. Gibt es dazu irgendwo Empfehlungen? Also Antworten auf Fragen wie

                • Darf/Muss eine HTML-Seite genau 1x <h1> enthalten?

                Ich finde es nur einmal sinnvoll ... <h1> enthält bei mir meistens das selbe wie <title>, manchmal etwas ähnliches. Ich habe eigentlich noch kein schriftliches Dokument gesehen, bei dem das nicht so ist. daher denke ich, man kann das recht direkt übertragen.

                Gruß,
                KonRad -

                --
                »Choose life.« - Trainspotting, drug addict
                »Choose life.« - Deuteronomy 30.19, GOD
              2. Moin moin Frank,

                keine Ahnung, ob Du das jetzt noch liest, aber trotzdem der Vollständigkeit halber (zur Not fürs Archiv).

                Wobei die Überschrift sinnvollerweise niemals <h1> sein kann, also eine Überschrift ERSTER Ordnung. Womit willst Du sonst den Titel Deiner Website formatieren? Und den Titel der einzelnen Seiten?

                Gibt es dazu irgendwo Empfehlungen? Also Antworten auf Fragen wie

                Mit Sicherheit, aber nicht beim W3C, sondern in Lehrbüchern für Journalisten o. ä. - das betrifft ja nicht nur HTML. Das hat eher allgemein was mit Schreibstil zu tun.

                • Darf/Muss eine HTML-Seite genau 1x <h1> enthalten?

                Nicht unbedingt, wenn es mehrere 1.-Priorität-Überschriften sinnvollerweise gibt - meine Vorstellungskraft reicht dafür aber nicht aus. Ist so ähnlich wie ein Verzeichnis-Baum. Irgendwo muss ein (root-) Verzeichnis sein, in dem alle anderen drin liegen...

                • Ist es erlaubt, in einem HTML-Dokument <h1> für einen Menübereich und gleichzeitig für einen Inhaltsbereich anzugeben?

                HTML zumindest verbietet das nicht - wie gesagt: ich kann den Sinn nicht erkennen - wie kann das Menü genauso wichtig sein, wie der Name der Site? Wir reden hier schließlich über die Überschrift höchster Ordnung, wo es nichts mehr drüber geben kann - höchstens daneben - ist das Menü irgendeiner Seite wirklich so bedeutend wie der Name des Angebotes selber?

                In der Doku des W3 steht leider nur, dass <h1> bis <h6> Überschriften sind und zur Strukturierung verwendet werden sollen.

                Ja, und zwar wird mit den Zahlen eine Hierarchie vorgegeben - das ist das entscheidende!

                Text, der mit einer Überschrift <h6> überschrieben ist, ist eben nicht so wichtig wie Text, der mit <h1> überschrieben ist.

                Beispiel:

                <h1>Titel der Veröffentlichung (z. B. Website)</h1>
                  <h2>Überschrift Einleitung</h2>
                    <p> Ganz Viele Absätze</p>
                  <h2>Überschrift Hauptteil</h2>
                    <h3>1. Kapitel-Bezeichnung</h3>
                       <h4>Untertitel<h/4>
                         <p> Ganz Viele Absätze</p>
                         <p> Ganz Viele Absätze</p>
                         <p> Ganz Viele Absätze</p>
                         <p> Ganz Viele Absätze</p>
                    <h3>2. Kapitel-Bezeichnung</h3>
                       <h4>Untertitel</h4>
                         <p> Ganz Viele Absätze</p>
                         <p> Ganz Viele Absätze</p>
                         <p> Ganz Viele Absätze</p>
                  <h2>Überschrift Nachwort</h2>
                    <p> Ganz Viele Absätze</p>
                    <p> Ganz Viele Absätze</p>

                Macht das Sinn?

                Wie strukturierst du z. B. Word-Dokumente? Hast Du mal die Ansicht Dokument-Struktur verwendet? Da sollte es ähnlich aussehen!

                Gruß,
                Marc.

                --
                sh:( fo:| ch:? rl:? br:> n4:& ie:% mo:} va:} de:] zu:) fl:( ss:| ls: js:(
                http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A%28+fo%3A%7C+ch%3A%3F+rl%3A%3F+br%3A%3E+n4%3A%26+ie%3A%25+mo%3A%7D+va%3A%7D+de%3A%5D+zu%3A%29+fl%3A%28+ss%3A%7C+ls%3A+js%3A%28
              3. Hallo.

                Gibt es dazu irgendwo Empfehlungen? Also Antworten auf Fragen wie

                • Darf/Muss eine HTML-Seite genau 1x <h1> enthalten?

                Auszeichnugen sollten sich am Inhalt des Dokuments orientieren. Da niemand den Inhalt deiner Dokumente voraussagen kann, erübrigen sich allgemeingültige Regeln, die über die Syntax hinausgehen.

                • Ist es erlaubt, in einem HTML-Dokument <h1> für einen Menübereich und gleichzeitig für einen Inhaltsbereich anzugeben?

                Das ist keine Frage der Erlaubnis, sondern des Sinngehaltes. Wenn du deinen Lesern eine solche Struktur plausibel machen kannst, verwende sie.

                In der Doku des W3 steht leider nur, dass <h1> bis <h6> Überschriften sind und zur Strukturierung verwendet werden sollen.

                In einer anderen Dokumentation des W3C steht erfreulicherweise, dass die nächste Version von (X)HTML nicht mehr auf feste Überschriften-Hierarchien zurückgreifen muss, sondern sich diese Hierarchie aus der Verschachtelung von Abschnitten und Absätzen ergibt.
                MfG, at

      2. Hallo,

        bei mir macht der aber bei float vorher einen zeilenumbruch, also auch nicht ganz korrekt.
        habs auch mit display:inline; versucht, klappt aber auch nicht...

        Das, was nach rechts ausgerichtet werden soll, muss vor den Text, also z.B. so:

        <h2><span style="float: right">rechts</span>Text</h2>

        Viele Grüße
        Frank

    2. Mit float komme ich hier ja leider nicht weiter, es sei denn, ich packe den Text vor dem Datum ebenfalls in einen <span>.

      float ist exakt das Richtige. Wieso macht es bei Dir Probleme? Ggf. könntest Du mit position arbeiten.

      Hmm. float klappt hier nicht und das ist IMHO auch korrekt, da sich der span ja /im/ Block-Level-Element befindet, nicht daneben. Damit float hier klappt, müsste der Text vor dem Datum ebenfalls in einen <span> gepackt werden, der dann 'display: block' erhält. Oder mache ich da einen Denkfehler?

      Jedenfalls funktioniert Folgendes nicht:

      \\ <html>
          <head>
              <style>
                  h2    { background: yellow; width: 30em; }
                  .date { background: green; display: block; float; right; width: 10em; }
              </style>
          </head>
          <body>
              <h2>foo bar <span class="date">bar foo</span></h2>
          </body>
      </html>
      ///

      Wie meinst Du das mit position? Explizite x- und y-Angaben behagen mir nicht so recht ... die kenne ich ja nicht.

      Gruß,
      KonRad -

      --
      »Choose life.« - Trainspotting, drug addict
      »Choose life.« - Deuteronomy 30.19, GOD
      1. Hi,

        Hmm. float klappt hier nicht

        was heißt "klappt nicht"?

        und das ist IMHO auch korrekt, da sich der span ja /im/ Block-Level-Element befindet, nicht daneben.

        Das ist unerheblich. Er soll ja auch /im/ Block-Level-Element rechts sein, oder sehe ich das falsch?

        Damit float hier klappt, müsste der Text vor dem Datum ebenfalls in einen <span> gepackt werden, der dann 'display: block' erhält.

        Nö.

        Jedenfalls funktioniert Folgendes nicht:

        "Funktioniert nicht" funktioniert nicht. Fehlerbeschreibung, bitte.

        Wie meinst Du das mit position? Explizite x- und y-Angaben behagen mir nicht so recht ... die kenne ich ja nicht.

        Doch, die kennst Du sehr genau: 0 Pixel von rechts.

        Cheatah

        --
        X-Self-Code: sh:( fo:} ch:~ rl:° br:> n4:& ie:% mo:) va:) de:] zu:) fl:{ ss:) ls:~ js:|
        X-Self-Code-Url: http://emmanuel.dammerer.at/selfcode.html
        X-Will-Answer-Email: No
        X-Please-Search-Archive-First: Absolutely Yes
        1. Hi,

          Hmm. float klappt hier nicht

          was heißt "klappt nicht"?

          "klappt nicht" heißt: siehe Beispiel. Sorry, nächstes Mal lade ich eins hoch und setze einen Link.

          und das ist IMHO auch korrekt, da sich der span ja /im/ Block-Level-Element befindet, nicht daneben.

          Das ist unerheblich. Er soll ja auch /im/ Block-Level-Element rechts sein, oder sehe ich das falsch?

          Ja. Dann habe ich die Specs zu float falsch verstanden. Ich verstehe das so, dass ein Element um ein anderes herumfließt.

          Jedenfalls funktioniert Folgendes nicht:

          "Funktioniert nicht" funktioniert nicht. Fehlerbeschreibung, bitte.

          Ich war immer der Ansicht, ein Code sage mehr als tausend Worte. Ausführen und schaun, wo's nicht klappt:
          http://madrat.net/tmp/foo.html

          Wie meinst Du das mit position? Explizite x- und y-Angaben behagen mir nicht so recht ... die kenne ich ja nicht.

          Doch, die kennst Du sehr genau: 0 Pixel von rechts.

          Das geht aber nur mit position:absolute und damit ist es dann 0 Pixel vom rechten Bildschirmrand entfernt, nicht 0 Pixel vom rechten Rand des Eltern-Elements.

          Gruß,
          KonRad -

          --
          »Choose life.« - Trainspotting, drug addict
          »Choose life.« - Deuteronomy 30.19, GOD
          1. Moin moin

            Ich war immer der Ansicht, ein Code sage mehr als tausend Worte. Ausführen und schaun, wo's nicht klappt:

            Das sich ein nicht valides Dokument so verhält, wie Du willst, kannst du zwar hoffen, aber nicht erwarten. :-)

            Du solltest auch beim Testen mit einer DOCTYPE-Angabe arbeiten. Vorzugsweise mit derselben, die Du dann später im "echten" Dokument einsetzen wirst. :-)

            Aber ich denke, Deine Frage ist inzwischen beantwortet?

            Du musst das Datum nach vorne stellen!!! (Ist zumindest im angegebenen Beispiel noch nicht geschehen...)

            Gruß,
            Marc.

            --
            sh:( fo:| ch:? rl:? br:> n4:& ie:% mo:} va:} de:] zu:) fl:( ss:| ls: js:(
            http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A%28+fo%3A%7C+ch%3A%3F+rl%3A%3F+br%3A%3E+n4%3A%26+ie%3A%25+mo%3A%7D+va%3A%7D+de%3A%5D+zu%3A%29+fl%3A%28+ss%3A%7C+ls%3A+js%3A%28
            1. Moin moin

              Ich war immer der Ansicht, ein Code sage mehr als tausend Worte. Ausführen und schaun, wo's nicht klappt:

              Das sich ein nicht valides Dokument so verhält, wie Du willst, kannst du zwar hoffen, aber nicht erwarten. :-)

              Ach, ich schreibe nicht zu jedem Beispiel Doctype, Content Type und Title-Element hinzu. Das beeinträchtigt das Rendern in einem "guten" Browser nicht ;-)

              Du solltest auch beim Testen mit einer DOCTYPE-Angabe arbeiten. Vorzugsweise mit derselben, die Du dann später im "echten" Dokument einsetzen wirst. :-)

              ändert nichts.

              Aber ich denke, Deine Frage ist inzwischen beantwortet?

              Nein.

              Du musst das Datum nach vorne stellen!!!

              Da gehört es wirklich nicht hin. Ich verzichte eher auf die Rechts-Ausrichtung, die "Design" ist (und damit absolut zweitwichtig im Vergleich zum Inhalt), als dass ich das Datum nach vorne stelle, was ein Eingriff in die logische Positionierung und damit die Aussage wäre.

              Gruß,
              KonRad -

              --
              »Choose life.« - Trainspotting, drug addict
              »Choose life.« - Deuteronomy 30.19, GOD
              1. Aber ich denke, Deine Frage ist inzwischen beantwortet?

                Nein.

                Korrektur: doch, ist sie eigentlich. Es scheint nicht zu gehen. Egal.

                Vielen Dank an alle Helfer.

                Gruß,
                KonRad -

                --
                »Choose life.« - Trainspotting, drug addict
                »Choose life.« - Deuteronomy 30.19, GOD
              2. hi,

                Ach, ich schreibe nicht zu jedem Beispiel Doctype, Content Type und Title-Element hinzu. Das beeinträchtigt das Rendern in einem "guten" Browser nicht ;-)

                *aua*

                gruß,
                wahsaga

                --
                I'll try being nicer if you'll try being smarter.
                1. hi,

                  Ach, ich schreibe nicht zu jedem Beispiel Doctype, Content Type und Title-Element hinzu. Das beeinträchtigt das Rendern in einem "guten" Browser nicht ;-)

                  *aua*

                  Gegenbeispiel?

                  Gruß,
                  KonRad -

                  --
                  »Choose life.« - Trainspotting, drug addict
                  »Choose life.« - Deuteronomy 30.19, GOD
                  1. hi,

                    Ach, ich schreibe nicht zu jedem Beispiel Doctype, Content Type und Title-Element hinzu. Das beeinträchtigt das Rendern in einem "guten" Browser nicht ;-)

                    *aua*

                    Gegenbeispiel?

                    z.b. unterschied IE 6 quirks mode /compliant mode, was das box model angeht.

                    gruß,
                    wahsaga

                    --
                    I'll try being nicer if you'll try being smarter.
                    1. Hallo wahsaga,

                      ... Rendern in einem "guten" Browser nicht ;-)

                      ^^^^^

                      z.b. unterschied IE 6 quirks mode /compliant mode, was das box model angeht.

                      ^^^^

                      Zählst du den IE 6 zu den "guten" Browsern? ;)

                      Auf Wiederlesen
                      Detlef

                      --
                      - Wissen ist gut
                      - Können ist besser
                      - aber das Beste und Interessanteste ist der Weg dahin!
                      1. Hi,

                        ... Rendern in einem "guten" Browser nicht ;-)

                        ^^^^^

                        Zählst du den IE 6 zu den "guten" Browsern? ;)

                        Zählst Du IE zu den Browsern? ;-)

                        cu,
                        Andreas

                        --
                        MudGuard? Siehe http://www.Mud-Guard.de/
                        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
          2. Hallo,

            Doch, die kennst Du sehr genau: 0 Pixel von rechts.

            Das geht aber nur mit position:absolute und damit ist es dann 0 Pixel vom rechten Bildschirmrand entfernt, nicht 0 Pixel vom rechten Rand des Eltern-Elements.

            Es sei denn, das Elternelement hat position: relative.

            Viele Grüße
            Frank

            1. Hallo,

              Das geht aber nur mit position:absolute und damit ist es dann 0 Pixel vom rechten Bildschirmrand entfernt, nicht 0 Pixel vom rechten Rand des Eltern-Elements.

              Es sei denn, das Elternelement hat position: relative.

              Das habe ich wohl überlesen. Danke, so klappt es hervorragend.

              Gruß,
              KonRad -

              --
              »Choose life.« - Trainspotting, drug addict
              »Choose life.« - Deuteronomy 30.19, GOD
  2. hi,

    <h2>Neues Auto <span class="date">19/02/1985</date></h2>

    Mit float komme ich hier ja leider nicht weiter, es sei denn, ich packe den Text vor dem Datum ebenfalls in einen <span>.

    falsch.

    aber wenn der span nach rechts gefloatet werden soll, muss er natürlich als erstes im <h1> stehen:

    <h1><span style="float:right; width:...;">19/02/1985</span>Neues Auto</h1>

    gruß,
    wahsaga

    --
    I'll try being nicer if you'll try being smarter.
    1. Moin,

      aber wenn der span nach rechts gefloatet werden soll, muss er natürlich als erstes im <h1> stehen:

      <h1><span style="float:right; width:...;">19/02/1985</span>Neues Auto</h1>

      Wie ich weiter unten bereits schrieb: ich schreibe mein Markup nicht so, dass es sich gut formatieren lässt. Ich liefere von der fraglichen Webseite (an den MSIE) eine Style-lose Version aus, daher kann ich nicht einfach die Reihenfolge der Markup-Elemente umkehren. Auch ein Screenreader würde mich dann erwürgen. Und Lynx ... na Lynx würde das auch nicht toll finden. Und damit ich nicht.

      Gruß,
      KonRad -

      --
      »Choose life.« - Trainspotting, drug addict
      »Choose life.« - Deuteronomy 30.19, GOD
  3. Keine Ahnung, ob es jemanden interessiert, aber da ich es im Archiv noch nicht gefunden habe, hier noch einmal das Endergebnis:

    http://caliph.madrat.net/news.xhtml

    Elternelement: 'position: relative'
    Kindeselement: 'position: absolute; right: 0;'

    Noch einmal vielen Dank.

    Gruß,
    KonRad -

    --
    »Choose life.« - Trainspotting, drug addict
    »Choose life.« - Deuteronomy 30.19, GOD
    1. hi,

      Keine Ahnung, ob es jemanden interessiert, aber da ich es im Archiv noch nicht gefunden habe, hier noch einmal das Endergebnis:

      http://caliph.madrat.net/news.xhtml

      da sehe ich eine unformatierte seite - und dafür der ganze aufstand?

      ja, ich betrachte die seite gerade mit einem IE 5.
      evtl. hast du für diesen das stylesheet extra weggelassen ...

      allerdings sollte man mit dem einfügen von hinweisen á la

      "Attention: Quirks mode used to output this file because of lacking standard compliance from browser application."

      vorsichtig sein - da der hinter </html> steht, ist es in der ausgelieferten version vor allem _deine seite_, bei der es an einhaltung der standards "lackt".

      gruß,
      wahsaga

      --
      I'll try being nicer if you'll try being smarter.
      1. Moin,

        da sehe ich eine unformatierte seite - und dafür der ganze aufstand?

        ja, ich betrachte die seite gerade mit einem IE 5.
        evtl. hast du für diesen das stylesheet extra weggelassen ...

        Blick in den Quelltext verrät: ja.

        allerdings sollte man mit dem einfügen von hinweisen á la

        "Attention: Quirks mode used to output this file because of lacking standard compliance from browser application."

        vorsichtig sein - da der hinter </html> steht, ist es in der ausgelieferten version vor allem _deine seite_, bei der es an einhaltung der standards "lackt".

        Korrekt. Nur denke ich, dass es dann eh egal ist, wenn die Seite ungültigen Code ausliefert, sie wird ja eh nur im Quirks Mode gerendert.
        Und ja, der Satz ist ziemlich "troll". Ich habe ihn aus dem Grund da stehen, dass sich viele die Seite angeschaut haben und dann meinten "bää, die hat ja keine Styles". Solche Leute möchte ich darauf hinweisen, dass die Seite Styles verfügt, die aber leider über keine mir bekannte Maßnahme in Browsern à la MSIE emuliert werden können.
        Bei den Styles handelt es sich um die Formatierung von Listen mit Sprachdefinitions-Produktionen in der Backus-Naur-Form.
        Bei der Seite handelt es sich in erster Hinsicht um ein technisches Dokument, da finde ich so etwas vertretbar: wer einen guten Browser hat, hat das Glück, eine vernünftig benutzbare Dokumentation vorzufinden. Wer einen älteren Browser hat, kann die Seite trotzdem ohne Einbußen benutzen, muss aber auf einige "Features" verzichten, die die BNF ordentlicher rendern.

        Gruß,
        KonRad -

        --
        »Choose life.« - Trainspotting, drug addict
        »Choose life.« - Deuteronomy 30.19, GOD
        1. hi,

          Bei den Styles handelt es sich um die Formatierung von Listen mit Sprachdefinitions-Produktionen in der Backus-Naur-Form.

          wenn du damit das automatische aufklappen beim hover meinst: extrem nervig, weil man durch das auf- und zuklappen viel zu leicht mit dem mauszeiger "verrutscht".

          das ist in meinen augen kein hilfreiches feature, sondern ein ärgerliches.

          gruß,
          wahsaga

          --
          I'll try being nicer if you'll try being smarter.
          1. hi,

            Bei den Styles handelt es sich um die Formatierung von Listen mit Sprachdefinitions-Produktionen in der Backus-Naur-Form.

            wenn du damit das automatische aufklappen beim hover meinst:

            Nein.

            Gruß,
            KonRad -

            --
            »Choose life.« - Trainspotting, drug addict
            »Choose life.« - Deuteronomy 30.19, GOD
            1. Moin moin

              Bei den Styles handelt es sich um die Formatierung von Listen mit Sprachdefinitions-Produktionen in der Backus-Naur-Form.

              wenn du damit das automatische aufklappen beim hover meinst:

              Nein.

              Nette Antwort, nachdem Dir hier so viele Leute so lange versucht haben zu helfen. Hätten wir uns so kurz gefasst, wäre das Datum immer noch da, wo es war, bevor Du gefragt hast...

              Das Mousover-Aufklappen ist übrigens wirklich Müll - es ist unmöglich (!) nach der ersten Nachricht die zweite anzeigen zu lassen...

              Von dem Verrutschen aller darunterliegenden Nachrichten ganz zu schweigen.

              Es macht zwar immer Spaß, etwas zu haben, was kein anderer hat - im Webdesign heißt das aber immer: der Nutzer muss erst mal lernen, wie Deine Seite zu bedienen ist. Intuitiv ist immer nur das, was man schon kennt.

              Gruß,
              Marc.

              --
              sh:( fo:| ch:? rl:? br:> n4:& ie:% mo:} va:} de:] zu:) fl:( ss:| ls: js:(
              http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A%28+fo%3A%7C+ch%3A%3F+rl%3A%3F+br%3A%3E+n4%3A%26+ie%3A%25+mo%3A%7D+va%3A%7D+de%3A%5D+zu%3A%29+fl%3A%28+ss%3A%7C+ls%3A+js%3A%28
              1. wenn du damit das automatische aufklappen beim hover meinst:

                Nein.

                Nette Antwort, nachdem Dir hier so viele Leute so lange versucht haben zu helfen.

                Nun, ich dachte, die Antwort war auf den Punkt gebracht. Es kam mir vor, als sei eine Ausführung seitens des Fragestellers nicht wirklich erwünscht. Ich denke, genau die erwünschte Antwort gegeben zu haben.

                Hätten wir uns so kurz gefasst, wäre das Datum immer noch da, wo es war, bevor Du gefragt hast...

                Ja. Damit hätte ich mich dann ja auch begnügt. Aber: die Antwort wäre dann nicht korrekt gewesen. Aber wenn wir dabei sind: was hätte ich denn antworten sollen?

                Das Mousover-Aufklappen ist übrigens wirklich Müll - es ist unmöglich (!) nach der ersten Nachricht die zweite anzeigen zu lassen...

                Das ist ja auch nicht Sinn der Sache (das Durchrattern der News).
                Die News nehmen mir einfach zuviel Platz weg, also ist Wegklappen die logische Konsequenz. Auf JS bzw. serverseitige Scripte will ich verzichten, daher kommt Aufklappen per Klick nicht in Frage. Ein Extra-Link für solch eine kleine Quantität Text -- im Wesentlichen ein Link -- finde ich ungerechtfertigten Aufwand.
                Also habe ich das IMHO kleinste Übel gewählt.
                Eventuell nehme ich das aber alles heraus und lasse statt dessen nur die oberste Nachricht stehen (permanent sichtbar), für die älteren nur noch den Titel. Das hätte den Nachteil, dass ich bei jeder Änderung mehr editieren müsste.

                Von dem Verrutschen aller darunterliegenden Nachrichten ganz zu schweigen.

                ... und das ist von Nachteil _weil_?

                Es macht zwar immer Spaß, etwas zu haben, was kein anderer hat - im Webdesign heißt das aber immer: der Nutzer muss erst mal lernen, wie Deine Seite zu bedienen ist. Intuitiv ist immer nur das, was man schon kennt.

                Intuitiv ist IMHO das, was man nicht kennen muss, um es trotzdem verwenden zu können. Aufklappende Nachrichten beim Rüberbewegen der Maus finde ich hinreichend intuitiv, zumal sich die Seite nicht an "irgendwen" richtet sondern an ein Publikum, das ich fast ausschließlich kenne und von dem ich ausgehe, dass es mit einer solchen "Interaktion" klarkommt. Der "Schluckauf" ist ärgerlich aber hier stößt man an die technischen Grenzen von CSS -- berichtige mich, wenn ich falsch liege.

                -- Ich hätte das ganze Posting auch anders formulieren können: Danke für eure Hilfe, aber auf Bashing (wenn es auf mich geht) habe ich keine Lust und würge es im Keim ab. Und ich bin mir /ziemlich/ sicher, dass "wahsaga" ein wenig "bashen" wollte. Schließlich bin ich nicht zum ersten Mal in einem Forum.

                Gruß,
                KonRad -

      2. Moin moin

        da sehe ich eine unformatierte seite - und dafür der ganze aufstand?

        ja, ich betrachte die seite gerade mit einem IE 5.
        evtl. hast du für diesen das stylesheet extra weggelassen ...

        In IE5 mit SP1 sieht es nicht besser aus... :(

        Gruß,
        Marc.

        --
        sh:( fo:| ch:? rl:? br:> n4:& ie:% mo:} va:} de:] zu:) fl:( ss:| ls: js:(
        http://www.peter.in-berlin.de/projekte/selfcode/?code=sh%3A%28+fo%3A%7C+ch%3A%3F+rl%3A%3F+br%3A%3E+n4%3A%26+ie%3A%25+mo%3A%7D+va%3A%7D+de%3A%5D+zu%3A%29+fl%3A%28+ss%3A%7C+ls%3A+js%3A%28
        1. Moin,

          ja, ich betrachte die seite gerade mit einem IE 5.
          evtl. hast du für diesen das stylesheet extra weggelassen ...

          In IE5 mit SP1 sieht es nicht besser aus... :(

          Ja, nicht verwunderlich. Ich überprüfe, ob der Zielbrowser den Content-Typen "appliction/xhtml+xml" kennt und liefere je nachdem eine Version mit bzw. ohne Stylesheet aus. Das ist die zuverlässigste Erkennung "beschnittener" Browser, die ich kenne. Dass auch sie nicht zuverlässig ist, weiß ich. Aber sie ist realitätsnahe.

          Gruß,
          KonRad -

  4. Hi,

    <h2>Neues Auto <span class="date">19/02/1985</date></h2>

    <style type="text/css">

    h1 { line-height:1.3em; width:30em; }

    #first { text-align:right; }
    #first span { float:left; width:20em; text-align:left; }

    #secnd { text-align:left; }
    #secnd span { float:right; width:10em; text-align:right; }
    #secnd span { margin-top:-1.3em; } /* Vor Opera noch verstecken */

    </style></head><body>

    <h1 id="first"><span>Neues Auto</span>22.07.2004</h1>
    <h1 id="secnd">Neues Auto<span>22.07.2004</span></h1>

    Zwei Varianten:
    die erste packt statt des Datums den Titel in ein span und läßt diesen links floaten, während der Text rechts ausgerichtet ist.

    die zweite packt das Datum ins span, läßt dieses rechts floaten und verschiebt über den negativen margin-top das Datum auf die gleiche Höhe (um eine Zeile nach oben, daher auch die explizite Angabe der Zeilenhöhe.

    Irgendwer wird sicher noch den nötigen CSS-Hack wissen, um den margin-top der zweiten Variante vor dem Opera zu verstecken (zumindest der Opera 7.21, den ich hier habe, stellt das Datum sonst über der Überschrift an).

    cu,
    Andreas

    --
    MudGuard? Siehe http://www.Mud-Guard.de/
    Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.
    1. Hallo,

      #secnd span { margin-top:-1.3em; } /* Vor Opera noch verstecken */

      <h1 id="first"><span>Neues Auto</span>22.07.2004</h1>
      <h1 id="secnd">Neues Auto<span>22.07.2004</span></h1>

      Manche Seitenbesucher werden sich fragen, was ein »Auto22« ist. ;)

      Irgendwer wird sicher noch den nötigen CSS-Hack wissen, um den margin-top der zweiten Variante vor dem Opera zu verstecken (zumindest der Opera 7.21, den ich hier habe, stellt das Datum sonst über der Überschrift an).

      Konqueror stellt das Datum übrigens auch über der Überschrift dar. Ich denke nicht, dass Hacks hier angebracht sind. Hacks, mit denen man z.B. Netscape 4 usw. ausschließt, sind recht zuverlässig. Die Hacks, mit denen Code vor aktuellen Browsern versteckt wird, haben hingegen eine geringe Halbwertszeit, weil sich die Browser in ständiger Weiterentwicklung befinden. Sobald ein Hack bekannt wird, der einen Browserfehler ausnutzt, arbeiten die Entwickler schon an einem Fix für selbigen Fehler. Das heißt früher oder später schlägt die beschriebene Abweichung sowieso durch, Hacks würden somit zum reinen Provisorium.

      Mathias