molily: [SASS] mixin @media rule Verknüpfung der Expressions?

Beitrag lesen

Hallo,

Mein geschätzter Kollege hat mir grad ins Ohr geflüstert, beim UC-Browser sind es 19px.

Ich bin nicht gut in Mathe, aber: Solange es nicht signifikant weniger oder mehr ist, als ich annehme, greifen die stacked MQs korrekt.

Prämisse: Browser runden em-Werte in MQs kaufmännisch auf volle px, bevor sie angewendet werden.

Angenommen ich lasse die MQ bei x + 1/16em anfangen:

@media screen and … and (max-width: 50em)
@media screen and (min-width: 50.0625em) and …

Bei den genannten 19px wären 1/16em berechnete 1.1875px. Abgerundet 1px. Also würden die MQs funktionieren, es gäbe keinen »Zwischenraum«, in dem keine der beiden MQs greift.

Wenn ich hingegen eine Basis-Schriftgröße von 8px annehme:

1/16em * 8px = 0.5px

Wird aufgerundet auf 1px. *Darunter* (7px) würde es kritisch werden, dann würde abgerundet.

Anders herum: Wenn ich hingegen eine Basis-Schriftgröße von 24px hätte:

1/16em * 24px = 1.5px

Wird aufgerundet auf 2px. Damit gäbe es eine Viewport-Breite, in dem keine der beiden MQs greift.

Sprich, wenn ich von 16px ausgehe, habe ich eine Toleranz von 8px - 23px. (Man korrigiere mich.)

Das ist, behaupte ich einmal, in der Praxis genug, um Fehler zu vermeiden. Es kommt noch hinzu, dass der Viewport genau diese Pixelbreite haben muss, um den Fehler auszulösen. Das ist alles möglich, aber äußerst unwahrscheinlich. Die Wahrscheinlichkeit, dass ich nach dem Schreiben dieses Postings aus heiterem Himmel tot umfalle, ist vermutlich höher. ;)

Disclaimer:
Die Prämisse kann natürlich falsch sein, z.B. falls Sub-Pixel-Rendering angewandt wird, dann sind alle Schlüsse hinfällig.
Ich habe es nicht in Browsern getestet, das ist alles bloß theoretisch.

Mathias

0 84

[SASS] mixin @media rule Verknüpfung der Expressions?

Gunther
  • css
  1. 1
    Gunnar Bittersmann
    1. 0
      Gunther
      1. 0
        Gunnar Bittersmann
        1. 0
          Gunther
          1. 0

            Korrektur: Geht doch ohne 'unquote()'

            Gunther
          2. 0
            Gunnar Bittersmann
            1. 0
              Gunther
              1. 1
                Gunnar Bittersmann
                1. 0
                  Gunther
                  1. 0
                    Gunnar Bittersmann
                    1. 0
                      Gunnar Bittersmann
                    2. 0
                      Gunther
                  2. 0
                    molily
                    1. 0
                      Gunnar Bittersmann
                    2. 0
                      Gunther
                      1. 0
                        molily
                        1. 0
                          Gunther
                          1. 0
                            molily
                            1. 0
                              Gunther
                              1. 0
                                molily
                                1. 0
                                  Gunther
                            2. 0

                              Mobile First

                              molily
                              • design/layout
            2. 0
              Gunnar Bittersmann
            3. 0
              Gunnar Bittersmann
              1. 0
                Gunther
                1. 0
                  Gunnar Bittersmann
              2. 0
                molily
                1. 0
                  Gunther
                  1. 0
                    Gunnar Bittersmann
                  2. 0
                    Gunnar Bittersmann
                  3. 0

                    gelesene Postings hervorheben

                    Gunnar Bittersmann
                    • zu diesem forum
                    1. 0
                      Gunther
                2. 0

                  "Lücke" in stacked MQs detektieren

                  Gunther
                  • javascript
                  1. 0
                    Gunnar Bittersmann
                    1. 0
                      Gunther
                  2. 0
                    molily
            4. 0

              Wert der Basis-Schriftgröße

              Gunther
              1. 0
                Gunnar Bittersmann
                1. 0
                  Gunther
                  1. 0
                    Gunnar Bittersmann
                    1. 0
                      Gunther
                      1. 0
                        Gunnar Bittersmann
                        1. 0
                          Gunther
                          1. 0
                            Gunther
                            1. 0
                              Gunnar Bittersmann
                              1. 0
                                Gunther
                                1. 0
                                  Gunnar Bittersmann
                                  1. 0
                                    Gunther
                                    1. 0
                                      Gunnar Bittersmann
                                      1. 0
                                        Gunther
                                        1. 0
                                          Gunnar Bittersmann
                                          1. 0
                                            Gunther
                                            1. 0
                                              Gunnar Bittersmann
                                              1. 0
                                                Gunnar Bittersmann
                                                1. 0
                                                  Gunther
                          2. 0
                            Gunnar Bittersmann
                            1. 0
                              Gunther
                              1. 0
                                Gunnar Bittersmann
                        2. 0
                          Gunnar Bittersmann
                        3. 0
                          Gunnar Bittersmann
                          1. 0
                            Gunnar Bittersmann
        2. 0
          Gunnar Bittersmann
          1. 0
            Gunther
            1. 0
              Gunnar Bittersmann
              1. 0
                Gunther
                1. 0
                  Gunnar Bittersmann
                  1. 0
                    Gunther
        3. 0
          molily
          1. 0
            Gunther
            1. 0
              molily
              1. 0
                Gunther
            2. 1
              Gunnar Bittersmann
              1. 0
                Gunther
                1. 0
                  Gunnar Bittersmann
                  1. 0
                    Gunther
                  2. 0
                    molily
                    1. 0
                      Gunnar Bittersmann
                      1. 0
                        Gunther
      2. 0
        molily
        1. 0
          Gunther
          1. 0
            molily
    2. 0
      Gunnar Bittersmann
      1. 0
        Gunther