Ankündigung

Einklappen
Keine Ankündigung bisher.

[resolved] Hänger bei flex-Modell

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • #16
    Wie meinst Du das? Warum sollte ich die Navi oder den Header ins main setzen?
    Competence-Center -> Enjoy the Informatrix
    PHProcks!Einsteiger freundliche TutorialsPreComposed Packages

    Kommentar


    • #17
      Eine Sache noch: Die Angabe von
      Code:
      flex: 1;
      Mach in meinen Augen keinen Sinn. Das Shorthand hat 3 Parameter: flex-grow, flex-shrink und flex-basis. Wenn du nur eines ansprechen willst, dann verwende doch das jeweilige...

      Kommentar


      • #18
        Zitat von derwunner Beitrag anzeigen
        Eine Sache noch: Die Angabe von
        Code:
        flex: 1;
        Mach in meinen Augen keinen Sinn. Das Shorthand hat 3 Parameter: flex-grow, flex-shrink und flex-basis. Wenn du nur eines ansprechen willst, dann verwende doch das jeweilige...
        Die Angabe aller drei Werte ist auch deshalb ratsam, weil die Browser bei der Shorthand-Variante unterschiedliche Defaultwerte für flex-basis nutzen. So setzt der IE11 flex-basis auf 0px, während es beim Chrome 0% sind.
        [SIZE="1"]Atwood's Law: any application that can be written in JavaScript, will eventually be written in JavaScript.[/SIZE]

        Kommentar


        • #19
          Das war mit nicht bewußt. Bei den Flex-Tutorials lese ich immer, dass das dem entspricht:
          Code:
          flex: 1 1 auto;
          Competence-Center -> Enjoy the Informatrix
          PHProcks!Einsteiger freundliche TutorialsPreComposed Packages

          Kommentar


          • #20
            Zitat von lottikarotti Beitrag anzeigen
            So setzt der IE11 flex-basis auf 0px, während es beim Chrome 0% sind.
            Was doch im Endeffekt das gleiche ist? 0 ist 0 und braucht keine Dimension.

            Kommentar


            • #21
              Zitat von hellbringer Beitrag anzeigen
              Was doch im Endeffekt das gleiche ist? 0 ist 0 und braucht keine Dimension.
              Sehe ich auch so, aber der IE11 eben nicht

              Um das Problem zu konkretisieren: Chrome und Konsorten verhalten sich bei 0px / 0% anders als der IE11. Tatsächlich führt "0" (also ohne Einheit) beim IE11 zu einem ähnlichen Verhalten wie "auto". Siehe Screenshot (=IE11). Unter Chrome werden alle 4 Varianten wie die auto-Variante gerendert. Wichtig: das tritt nur im Kontext von flex-flow: column auf.
              [SIZE="1"]Atwood's Law: any application that can be written in JavaScript, will eventually be written in JavaScript.[/SIZE]

              Kommentar


              • #22
                Zitat von Arne Drews Beitrag anzeigen
                Wie meinst Du das? Warum sollte ich die Navi oder den Header ins main setzen?
                Sollst du natürlich nicht, aber wenn man es täte und ein Aside und ein Media Query hinzufügen würde, hätte man das bekannte Holy Grail Layout.

                Kommentar


                • #23
                  Hier mal ne ganz witzige Seite, über die ich gestolpert bin, als ich mich schlauer machen wollte: http://flexboxfroggy.com/#de
                  Fand ich sehr lustig und zeigt imho spielerisch sehr gut die Unterschiede zwischen justify-content, align-items und align-content.
                  Competence-Center -> Enjoy the Informatrix
                  PHProcks!Einsteiger freundliche TutorialsPreComposed Packages

                  Kommentar

                  Lädt...
                  X