Pree Franz: Transition, Tabs nicht korrekt positioniert

Sehr geehrte Damen und Herren!

Ich habe mir erlaubt den Code "Beispiels 8: Dynamische Navigationsleisten einblenden" zu kopieren und in einen Editor einzusetzen. Es funktioniert tadellos. Zum Studium habe ich den Code nochmals in einem eigenen Fenster des Editors, allerdings händisch, Zeile für Zeile eingegeben um die einzelnen Auswirkungen erkennen zu können. Nun habe ich den Erfolg, daß zwar die Tabs tadellos erscheinen und funktionieren, aber nicht in der grauen Leiste drinnen sind sondern unterhalb. Ich habe meinen Code mit dem Original mehrmals verglichen aber den Fehler nicht finden können. Wo wird die Position der Tabs bestimmt? Ein Vergleich (meine Eingabe/Original) zeigt mir eher, daß nicht die Tabs falsch positioniert sind, sondern der graue Balken schmäler erscheint. Im CSS-Code gibt es "nav:after". Welche Funktion hat dies? Ich finde after als Selektor nirgends und eine Änderung ist weder bei der Eingabe zu bemerken noch wenn ich dies beim fertigen Code heraus lösche. Weiters ist mir die Bedeutung "<main role="main">" nicht ganz klar?

Mit freundlichen Grüßen Pree Franz

P.S.: Apple Yosemite 10.10.4 Safari Version 8.0.7 (10600.7.12)

  1. @@Pree Franz

    Sehr geehrte Damen und Herren!

    Heute so förmlich?

    Ich habe mir erlaubt den Code "Beispiels 8: Dynamische Navigationsleisten einblenden" zu kopieren und in einen Editor einzusetzen.

    Du hast vergessen, den URI des Beispiels anzugeben, damit man weiß, wovon du überhaupt sprichst.

    Vom URI zu deiner Seite ganz abgesehen.

    Im CSS-Code gibt es "nav:after". Welche Funktion hat dies? Ich finde after als Selektor nirgends

    Nicht? Es ist ein Pseudoelement.

    Weiters ist mir die Bedeutung "<main role="main">" nicht ganz klar?

    Das ist ein Container für den Hauptinhalt der Seite. Assistive Technologien (Screenreader) könnten dem Nutzer anbieten, direkt zum Hauptinhalt zu springen.

    LLAP 🖖

    --
    Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
    1. @@Pree Franz

      Sehr geehrte Damen und Herren!

      Heute so förmlich? War nicht meine Absicht. Bin das erste mal hier oder es liegt schon länger zurück.

      Ich habe mir erlaubt den Code "Beispiels 8: Dynamische Navigationsleisten einblenden" zu kopieren und in einen Editor einzusetzen.

      Du hast vergessen, den URI des Beispiels anzugeben, damit man weiß, wovon du überhaupt sprichst. http://wiki.selfhtml.org/extensions/Selfhtml/example.php/Beispiel:CSS_Menüs8.html Vom URI zu deiner Seite ganz abgesehen. Habe zwar noch keine grandiose fertige Seite da ich noch immer herum bastle. Es ist noch eine alte homepage mit frames die nicht im Netz ist. Nun hat sich ja einiges geändert und versuche daher diese zu ändern. Allerdings habe ich eine kurze Form meiner Ahnenforschung; also nicht Besonderes. Sollte vom Frame zur Ahnenforschung umleiten.

      http://members.aon.at/ahnen_pree/

      Im CSS-Code gibt es "nav:after". Welche Funktion hat dies? Ich finde after als Selektor nirgends

      Nicht? Es ist ein Pseudoelement. Danke!

      Weiters ist mir die Bedeutung "<main role="main">" nicht ganz klar?

      Das ist ein Container für den Hauptinhalt der Seite. Assistive Technologien (Screenreader) könnten dem Nutzer anbieten, direkt zum Hauptinhalt zu springen. Auf Container wird ja normal zugegriffen um den Inhalt zu gestalten? Screenreader ist anscheinend ein eigenes Kapitel? Ist aber erst das nächste Problem da ich derzeit noch an CSS arbeite. Ist übrigens mein Bild mitgeschickt worden damit man sieht wie es bei mir aussieht? Habe es in den Rahmen gezogen wie beschrieben.

      LG Franz

      LLAP 🖖

      Ist diese Antwort anstößig? Dann könnte sie nützlich sein.

      1. Tach,

        da bist du wohl etwas mit den Markierungen für die Zitate durcheinandergekommen (deine Antworten sollten jeweils in einer Zeile stehen, die ohne „> “ beginnt), ich habe das mal aufgeräumt:

        @@Pree Franz

        Sehr geehrte Damen und Herren!

        Heute so förmlich? War nicht meine Absicht. Bin das erste mal hier oder es liegt schon länger zurück.

        Ich habe mir erlaubt den Code "Beispiels 8: Dynamische Navigationsleisten einblenden" zu kopieren und in einen Editor einzusetzen.

        Du hast vergessen, den URI des Beispiels anzugeben, damit man weiß, wovon du überhaupt sprichst. http://wiki.selfhtml.org/extensions/Selfhtml/example.php/Beispiel:CSS_Menüs8.html Vom URI zu deiner Seite ganz abgesehen. Habe zwar noch keine grandiose fertige Seite da ich noch immer herum bastle. Es ist noch eine alte homepage mit frames die nicht im Netz ist. Nun hat sich ja einiges geändert und versuche daher diese zu ändern. Allerdings habe ich eine kurze Form meiner Ahnenforschung; also nicht Besonderes. Sollte vom Frame zur Ahnenforschung umleiten. http://members.aon.at/ahnen_pree/

        Im CSS-Code gibt es "nav:after". Welche Funktion hat dies? Ich finde after als Selektor nirgends

        Nicht? Es ist ein Pseudoelement. Danke!

        Weiters ist mir die Bedeutung "<main role="main">" nicht ganz klar?

        Das ist ein Container für den Hauptinhalt der Seite. Assistive Technologien (Screenreader) könnten dem Nutzer anbieten, direkt zum Hauptinhalt zu springen. Auf Container wird ja normal zugegriffen um den Inhalt zu gestalten? Screenreader ist anscheinend ein eigenes Kapitel? Ist aber erst das nächste Problem da ich derzeit noch an CSS arbeite. Ist übrigens mein Bild mitgeschickt worden damit man sieht wie es bei mir aussieht? Habe es in den Rahmen gezogen wie beschrieben.

        LG Franz

        LLAP 🖖

        Ist diese Antwort anstößig? Dann könnte sie nützlich sein.

        mfg
        Woodfighter

      2. Tach,

        Auf Container wird ja normal zugegriffen um den Inhalt zu gestalten?

        unter anderem, ja

        Screenreader ist anscheinend ein eigenes Kapitel?

        Screenreader sind Programme, die z.B. Webseiten vorlesen statt sie auf einem Bildschirm darzustellen; da ist es dann häufig sinnvoll direkt zum Inhalt zu springen statt sich erst minutenlang mit Menüpunkten auseinanderzusetzen.

        Ist übrigens mein Bild mitgeschickt worden damit man sieht wie es bei mir aussieht? Habe es in den Rahmen gezogen wie beschrieben.

        Ich hab keins gesehen, kann in deinen Postings allerdings auch keinen Verweis auf eine Graphik sehen; wenn du ein Bild in den Bereich ziehst, wird im Textfeld etwas, wie das folgende

        ![Alternativ-Text](/images/702cee98-5b70-48f7-8fec-033eaf4c334f.png)
        

        eingebaut, und ich vermute, du hast es da wieder entfernt, bevor du das Posting abgeschickt hast.

        mfg
        Woodfighter

        1. Tach,

          Auf Container wird ja normal zugegriffen um den Inhalt zu gestalten?

          unter anderem, ja

          Screenreader ist anscheinend ein eigenes Kapitel?

          Screenreader sind Programme, die z.B. Webseiten vorlesen statt sie auf einem Bildschirm darzustellen; da ist es dann häufig sinnvoll direkt zum Inhalt zu springen statt sich erst minutenlang mit Menüpunkten auseinanderzusetzen.

          Ist übrigens mein Bild mitgeschickt worden damit man sieht wie es bei mir aussieht? Habe es in den Rahmen gezogen wie beschrieben.

          Ich hab keins gesehen, kann in deinen Postings allerdings auch keinen Verweis auf eine Graphik sehen; wenn du ein Bild in den Bereich ziehst, wird im Textfeld etwas, wie das folgende

          ![Alternativ-Text](/images/702cee98-5b70-48f7-8fec-033eaf4c334f.png)
          

          eingebaut, und ich vermute, du hast es da wieder entfernt, bevor du das Posting abgeschickt hast.

          mfg
          Woodfighter

          Danke! Ich ziehe das png-Bild mit gedrückter Maus in das Textfeld aber es kommt keine anklickbare Datei. Habe daher den Beitrag wieder korrigiert. Auch als zip-Datei erscheint ein reiner Text in blau.

          LG Franz

          1. Tach,

            Ich ziehe das png-Bild mit gedrückter Maus in das Textfeld aber es kommt keine anklickbare Datei. Habe daher den Beitrag wieder korrigiert. Auch als zip-Datei erscheint ein reiner Text in blau.

            dann probieren wir das doch mal andersherum, du klickst auf den Bereich in dem „Bilder hierher ziehen oder klicken, um sie hochzuladen.“ steht (ah, ich sehe gerade, dass du ins Textfeld geschrieben hast; der graue Kasten unterhalb des Textfeldes ist gemeint, nicht das Textfeld selber); bei mir geht dann ein Dateiauswahldialog auf und wählst da deine bilddatei aus (bitte ungezippt); dann wird im Textfeld an der Stelle, wo der Curser gerade ist der nötige code eingefügt: woodfighter ist kein Künstler

            mfg
            Woodfighter

          2. Hallo

            Ist übrigens mein Bild mitgeschickt worden damit man sieht wie es bei mir aussieht? Habe es in den Rahmen gezogen wie beschrieben.

            Ich hab keins gesehen, kann in deinen Postings allerdings auch keinen Verweis auf eine Graphik sehen; wenn du ein Bild in den Bereich ziehst, wird im Textfeld etwas, wie das folgende

            ![Alternativ-Text](/images/702cee98-5b70-48f7-8fec-033eaf4c334f.png)
            

            eingebaut, und ich vermute, du hast es da wieder entfernt, bevor du das Posting abgeschickt hast.

            Ich ziehe das png-Bild mit gedrückter Maus in das Textfeld aber es kommt keine anklickbare Datei. Habe daher den Beitrag wieder korrigiert. Auch als zip-Datei erscheint ein reiner Text in blau.

            Fü+r's nächste Mal: Über das Textfeld kann das Bild nicht in das Posting eingefügt werden. Unterhalb des Textfelds ist aber ein (im unten stehenden Bild gelb) markierter Bereich, über den Bilder in die Postings eingefügt werden können.

            Markierung des Bilderhochladebereichs

            Tschö, Auge

            --
            Es schimmerte ein Licht am Ende des Tunnels und es stammte von einem Flammenwerfer.
            Terry Pratchett, „Gevatter Tod“
            1. Hallo

              Ist übrigens mein Bild mitgeschickt worden damit man sieht wie es bei mir aussieht? Habe es in den Rahmen gezogen wie beschrieben.

              Ich hab keins gesehen, kann in deinen Postings allerdings auch keinen Verweis auf eine Graphik sehen; wenn du ein Bild in den Bereich ziehst, wird im Textfeld etwas, wie das folgende

              ![Alternativ-Text](/images/702cee98-5b70-48f7-8fec-033eaf4c334f.png)
              

              eingebaut, und ich vermute, du hast es da wieder entfernt, bevor du das Posting abgeschickt hast.

              Ich ziehe das png-Bild mit gedrückter Maus in das Textfeld aber es kommt keine anklickbare Datei. Habe daher den Beitrag wieder korrigiert. Auch als zip-Datei erscheint ein reiner Text in blau.

              Fü+r's nächste Mal: Über das Textfeld kann das Bild nicht in das Posting eingefügt werden. Unterhalb des Textfelds ist aber ein (im unten stehenden Bild gelb) markierter Bereich, über den Bilder in die Postings eingefügt werden können.

              Markierung des Bilderhochladebereichs

              Tschö, Auge

              --
              > Es schimmerte ein Licht am Ende des Tunnels und es stammte von einem Flammenwerfer.
              > Terry Pratchett, „Gevatter Tod“ Genau das habe ich beim ersten Mal gemacht aber keine Datei im Textfeld gesehen, daher die Frage ob eine Datei dabei war. Ich habe es nun mit dem Rüberziehen versucht und es dreht sich ein Punkt dann erscheint ein Feld mit "[object Objekt] das wieder verschwindet. Weiters habe ich es mit dem Klicken versucht und es kommt das Auswahlfenster.Ich wähle die Graphik aber trotzdem erscheint sie nicht im Textfeld. Es ist ein Bild mit Apple über shift-alt-4 gemacht und ist ein png-Bild. Kann es an dem liegen? LG Franz

              Genau das habe ich beim ersten Mal gemacht aber keine Datei im Textfeld gesehen, daher die Frage ob eine Datei dabei war. Ich habe es nun mit dem Rüberziehen versucht und es dreht sich ein Punkt dann erscheint ein Feld mit "[object Objekt] das wieder verschwindet. Weiters habe ich es mit dem Klicken versucht und es kommt das Auswahlfenster.Ich wähle die Graphik aber trotzdem erscheint sie nicht im Textfeld. Es ist ein Bild mit Apple über shift-alt-4 gemacht und ist ein png-Bild. Kann es an dem liegen?

              LG Franz

              1. Hallo

                Für's nächste Mal: Über das Textfeld kann das Bild nicht in das Posting eingefügt werden. Unterhalb des Textfelds ist aber ein (im unten stehenden Bild gelb) markierter Bereich, über den Bilder in die Postings eingefügt werden können.

                Markierung des Bilderhochladebereichs

                Genau das habe ich beim ersten Mal gemacht aber keine Datei im Textfeld gesehen, daher die Frage ob eine Datei dabei war. Ich habe es nun mit dem Rüberziehen versucht und es dreht sich ein Punkt dann erscheint ein Feld mit "[object Objekt] das wieder verschwindet. Weiters habe ich es mit dem Klicken versucht und es kommt das Auswahlfenster.Ich wähle die Graphik aber trotzdem erscheint sie nicht im Textfeld. Es ist ein Bild mit Apple über shift-alt-4 gemacht und ist ein png-Bild. Kann es an dem liegen?

                Komisch. Am Dateiformat (PNG) kann es definitiv nicht liegen, mein Bild ist auch eines.

                <del title="war schon in meinem Posting drin">Was mir aber soeben auffiel, ist das „ü“ im Wort „Für“ am Anfang meines, von dir zitierten Textes (oben fett und kursiv hervorgehoben). Ich habe das jetzt zwar korrigiert, aber mir wurde beim Laden des Formulars das „Für“ als „Fü+r“ angezeigt (mit Windows 7).

                Wenn ich richtig liege, liegt das „+“ an der von Apple benutzten Kodierung für Umlaute, bei der diese aus zwei Zeichen (zugrundeliegender Buchstabe (hier „u“) und den Punkten (Trema)) zusammengesetzt werden. Die anderen Betriebssysteme kodieren die Umlaute als jeweils ein Zeichen. Eventuell werden Dateinamen, die solcherart (aus zwei Zeichen) kodierte Umlaute enthalten, von der Forumssoftware nicht angenommen.

                Hattest du Umlaute im Dateinamen des Bildes?</del>

                Ach ja, nochmal für's nächste Mal: Bitte zitiere nur das, worauf du dich beziehst. Der Rest kann weg. Das macht die Sache übersichtlicher und vereinfacht das Lesen der Postings, auch wenn es etwas Arbeit bedeutet. Danke

                Tschö, Auge

                --
                Es schimmerte ein Licht am Ende des Tunnels und es stammte von einem Flammenwerfer.
                Terry Pratchett, „Gevatter Tod“
                1. Hattest du Umlaute im Dateinamen des Bildes?</del>

                  Nein. Meine Graphik heißt "Bildschirmfoto 2015-07-06 um 05.59.28.png"

                  LG Franz

  2. Servus!

    Sehr geehrte Damen und Herren!

    Ich habe mir erlaubt den Code "Beispiels 8: Dynamische Navigationsleisten einblenden" zu kopieren und in einen Editor einzusetzen.

    der Link: Dropown-Menü mit CSS

    Es funktioniert tadellos.

    Danke!

    Wo wird die Position der Tabs bestimmt? Ein Vergleich (meine Eingabe/Original) zeigt mir eher, daß nicht die Tabs falsch positioniert sind, sondern der graue Balken schmäler erscheint.

    Dann ist es die Höhe von nav, die du verändern musst.

    Im CSS-Code gibt es "nav:after". Welche Funktion hat dies? Ich finde after als Selektor nirgends und eine Änderung ist weder bei der Eingabe zu bemerken noch wenn ich dies beim fertigen Code heraus lösche.

    Das ist ein Clearfix. Ich glaub', den braucht's hier aber nicht.

    Weiters ist mir die Bedeutung "<main role="main">" nicht ganz klar?

    Main zeigt, dass es hier um den Hauptinhalt der Seite geht.

    Mit freundlichen Grüßen Pree Franz

    LG

    Matthias Scharwies

    1. Servus!

      Sehr geehrte Damen und Herren!

      Ich habe mir erlaubt den Code "Beispiels 8: Dynamische Navigationsleisten einblenden" zu kopieren und in einen Editor einzusetzen.

      der Link: Dropown-Menü mit CSS

      Es funktioniert tadellos.

      Auch bei mir. Auch die Seite die ich händisch zum Üben eingegeben habe funktioniert; nur die Tabs sind nicht im grauen Feld.

      Danke!

      Wo wird die Position der Tabs bestimmt? Ein Vergleich (meine Eingabe/Original) zeigt mir eher, daß nicht die Tabs falsch positioniert sind, sondern der graue Balken schmäler erscheint.

      Dann ist es die Höhe von nav, die du verändern musst.

      Obwohl die Werte mit dem Original übereinstimmen?

      Im CSS-Code gibt es "nav:after". Welche Funktion hat dies? Ich finde after als Selektor nirgends und eine Änderung ist weder bei der Eingabe zu bemerken noch wenn ich dies beim fertigen Code heraus lösche.

      Das ist ein Clearfix. Ich glaub', den braucht's hier aber nicht.

      Weiters ist mir die Bedeutung "<main role="main">" nicht ganz klar?

      Main zeigt, dass es hier um den Hauptinhalt der Seite geht.

      Hat somit in diesem Fall nur optischen Effekt für den Programmierer, also keine Funktion?

      LG Franz

      Mit freundlichen Grüßen Pree Franz LG

      Matthias Scharwies

      1. @@Pree Franz

        Main zeigt, dass es hier um den Hauptinhalt der Seite geht. Hat somit in diesem Fall nur optischen Effekt für den Programmierer, also keine Funktion?

        „[D]ass es hier um den Hauptinhalt der Seite geht“ hat nichts mit Optik zu tun; das ist Funktion.

        LLAP 🖖

        --
        Ist diese Antwort anstößig? Dann könnte sie nützlich sein.
      2. Hallo Pree Franz,

        Main zeigt, dass es hier um den Hauptinhalt der Seite geht. Hat somit in diesem Fall nur optischen Effekt für den Programmierer, also keine Funktion?

        Elemente sollten niemals für optische Effekte eingesetzt werden, sondern immer aus Gründen der Semantik. Unter anderem weil HTML-Dokumente auf unterschiedlichsten Medien dargestellt werden können. Für optische Effekte ist CSS da.

        Bis demnächst
        Matthias

        --
        Signaturen sind bloed (Steel) und Markdown ist mächtig.