Walter P.: grid nach flex

Hallo

vor einiger Zeit habe ich mir das

Grid-Bruchstück

aus einem HTML-Beispiel kopiert.

Das gesamte Beispiel finde ich nicht, wenn ich aber zu folgender Frage eine Lösung hätte, würde ich weiterkommen.

Daher: Gibt es ein ähnliches Beispiel auch in Flex?

  1. @@Walter P.

    Grid-Bruchstück

    Gibt es ein ähnliches Beispiel auch in Flex?

    Ein ähnliches Beispiel, bei dem rein gar nichts zu sehen ist? Könnte ich dir erstellen, aber was hättest du davon?

    Erstelle bitte ein Beispiel, aus dem hervorgeht, was du wissen willst. Und aus dem hervorgeht, warum du Flexbox anstatt Grid verwenden willst.

    🖖 Live long and prosper

    --
    “In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”
    — Bruce Springsteen, Manchester 2025-05-14
    1. Warum muss man immer begründen, warum man das eine möchte und nicht das andere? Es kommen doch immer sofort Kommentare im Selhtml, die etwas anderes vorschlagen.

      Ich hatte angenommen, dass einige wissen, was das CSS bewirkt oder das Beispiel wiedererkennen.

      1. @@Walter P.

        Warum muss man immer begründen, warum man das eine möchte und nicht das andere?

        Weil womöglich Grid das bessere Werkzeug als Flexbox für deine Problemstellung ist. Was sich aber nur beurteilen lässt, wenn man dein Problem kennt.

        Es kommen doch immer sofort Kommentare im Selhtml, die etwas anderes vorschlagen.

        Was du als Service ansehen solltest.

        Ich hatte angenommen, dass einige wissen, was das CSS bewirkt oder das Beispiel wiedererkennen.

        Was soll man auf der ostfriesischen Nationalflagge (weißer Adler auf weißem Grund – Otto) erkennen?

        Es gehört nicht zum Service (jedenfalls nicht zu meinem), anhand eines CSS-Schnipsels ohne zugehöriges Markup zu erraten, was du eventuell erreichen möchtest.

        🖖 Live long and prosper

        --
        “In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”
        — Bruce Springsteen, Manchester 2025-05-14
        1. Hallo Gunnar,

          er sagte doch, dass er nur denn Schnipsel hat.

          Der Duktus der Kommentare klingt nach mir, aber ich finde das Beispiel weder im Wiki noch im Forum, was an schlecht funktionierender Suche liegen kann oder daran, dass es ein Fiddle ist. Auf meinem Handy komme ich mit jsFiddle allerdings nicht zurecht (jaaa, Gunnar, Wasser auf deiner Codepen-Mühle).

          Letztlich muss ich mich dir aber anschließen: CSS ohne zugehöriges HTML ist nicht aussagefähig.

          Rolf

          --
          sumpsi - posui - obstruxi
          1. Hallo,

            in meiner Sicherung habe ich das Beispiel gefunden.

            Im Firefox ausgeführt, ändert sich die Struktur beim Verschmälern des Screens nicht:

            .

            Im Codepen geht das Nav nach oben allerdings in unschöner Form.

            Vielleicht habe ich eine unvollständige Version. Vielleicht erkennt der Autor sein Werk.

            1. @@Walter

              in meiner Sicherung habe ich das Beispiel gefunden.

              Hurra!

              Im Firefox ausgeführt, ändert sich die Struktur beim Verschmälern des Screens nicht

              Du hat die Viewportangabe vergessen?

              Im Codepen geht das Nav nach oben allerdings in unschöner Form.

              Was für dich unschön ist, ist für andere schön. Über Geschmack soll man nicht streiten.

              Was wolltest du uns eigentlich sagen?

              🖖 Live long and prosper

              --
              “In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”
              — Bruce Springsteen, Manchester 2025-05-14
              1. @@Gunnar

                Was wolltest du uns eigentlich sagen?

                Zitat aus dem Eingangsstatement:

                Gibt es ein ähnliches Beispiel auch in Flex?

                Flex ist mir persönlich lieber (Geschmäcker sind verschieden).

                Gruß

                Walter

                1. @@Walter

                  Flex ist mir persönlich lieber (Geschmäcker sind verschieden).

                  Deine persönlichen Vorlieben sind irrelevant. Die Frage ist: Welches ist das richtige Tool für dein gewünschtes Layout?

                  Unnötig zu erwähnen, dass sich die Frage immer noch nicht beantworten lässt, da du uns über dein gewünschtes Layout im Unklaren lässt.

                  🖖 Live long and prosper

                  --
                  “In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”
                  — Bruce Springsteen, Manchester 2025-05-14
                  1. Das Layout aus dem Beispiel

                    1. @@Walter

                      Das Layout aus dem Beispiel

                      Sag mal, willst du uns hier verarschen?

                      Wenn das Layout aus dem Beispiel das ist, was du willst, was ist daran unschön?

                      🖖 Live long and prosper

                      --
                      “In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”
                      — Bruce Springsteen, Manchester 2025-05-14
                      1. @@Walter

                        Das Layout aus dem Beispiel

                        Sag mal, willst du uns hier verarschen?

                        Wenn das Layout aus dem Beispiel das ist, was du willst, was ist daran unschön?

                        🖖 Live long and prosper

                        Sehr netter Umgangston! Wenn Du richtig gelesen hättest, wüsstest Du was ich meinte!

                        Ich habe gefragt, ob es ein ähnliches Beispiel der GRID-Version auch mit FLEX gäbe.

                        1. @@Walter

                          Sehr netter Umgangston! Wenn Du richtig gelesen hättest, wüsstest Du was ich meinte!

                          Wenn du doch bloß etwas zum Lesen abgeliefert hättest!

                          Hast du aber nicht. Du vergeudest hier nur unsere Zeit. Da brauchst du dich dann nicht zu beschweren, dass ich meinen Unmut darüber zum Ausdruck bringe.

                          Ich habe gefragt, ob es ein ähnliches Beispiel der GRID-Version auch mit FLEX gäbe.

                          Ja, vielleicht gibt es das. Wie ähnlich soll es denn sein?

                          Solange du darüber nicht mal ansatzweise etwas sagst, kannst du hier auch keine Antworten erwarten. Außer nettem Umgangston, weil man dir das wieder und wieder und wieder sagen muss.

                          🖖 Live long and prosper

                          --
                          “In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”
                          — Bruce Springsteen, Manchester 2025-05-14
                          1. Nimm Dir ein Beispiel an Jürgen.! Damit ist alles gesagt/geschrieben.

                            Wenn Du nicht verstehst, was mit einem ähnliches Flex-Beispiel wie das vorgestellte Grid-Beispiel gemeint ist, dann frage ich mich, wie ich es Dir sonst noch erklären könnte.

                            Ende der Durchsage!

                            1. @@Walter

                              Nimm Dir ein Beispiel an Jürgen.! Damit ist alles gesagt/geschrieben.

                              Ein Link zu einem nichtssagendem Abschnitt im Wiki – ja das passt auf deine nichtssagende Fragerei. 😈

                              Wenn Du nicht verstehst, was mit einem ähnliches Flex-Beispiel wie das vorgestellte Grid-Beispiel gemeint ist, dann frage ich mich, wie ich es Dir sonst noch erklären könnte.

                              Du warst es, der das vorgestellte Grid-Beispiel „unschön“ nannte, ohne weiter auszuführen – selbst auf wiederholte Nachfrage nicht – was damit gemeint ist.

                              Ende der Durchsage!

                              Jaja, werd hier am Ende noch pampig!

                              🖖 Live long and prosper

                              --
                              “In my home, the America I love, the America I've written about, that has been a beacon of hope and liberty for 250 years, is currently in the hands of a corrupt, incompetent and treasonous administration. Tonight, we ask all who believe in democracy and the best of our American spirit, to rise with us, raise your voices against authoritarianism, and let freedom reign.”
                              — Bruce Springsteen, Manchester 2025-05-14
                2. Hallo Walter,

                  Gibt es ein ähnliches Beispiel auch in Flex?

                  Flex ist mir persönlich lieber (Geschmäcker sind verschieden).

                  lies dir mal das hier durch: Flexbox oder Grid Layout?

                  Gruß
                  Jürgen

                  1. Das ist einmal ein hilfreicher Beitrag.

                    Nach den dortigen Ausführungen, wäre Flex nur bedingt oder gar nicht geeignet, das Grid-Beispiel zu ersetzen. Danke

            2. Hallo Gabriele Walter,

              ich erkenne mein Werk. Hier ist das Original - für Gabriele. Steht noch drin 😉

              Grundsätzlich ist Flex für eindimensionale Anordnungen vorgesehen (abgesehen von flex-wrap) und Grid für zweidimensionale Anordnungen. Deswegen lässt sich diese Umspringen der Navigation von „links“ nach „oben“ mit Flex nur sehr unschön umsetzen. Ich will nicht behaupten, dass es nicht ginge, mit geschicktem Ausnutzen von flex-wrap mag es möglich sein. Aber es wäre Gefummel. Grid ist dafür deutlich eleganter und verständlicher, vor allem, wenn noch mehr Elemente hinzukommen, die anzuordnen sind.

              Wenn Du mit dem nav, das nach oben geht, nicht zufrieden bist, dann beschreibe doch bitte mal, welche Unschönheit du darin siehst. Wenn es darum geht, dass die Navigationsleiste zweizeilig wird - tja, das ist unvermeidlich bei schmalem Bildschirm. Man müsste dann auf ein Popup-Menü umsteigen, wie ich auch im Fiddle schrieb – äh, schreiben wollte. Das Wort „Button“ hat sich verflüchtigt.

              Rolf

              --
              sumpsi - posui - obstruxi