CSS-Pixel im SELF-Wiki

[Matthias Scharwies]

Servus!

Ich bin über diesen Artikel gestolpert:

• smashing magazine: There Is No Such Thing As A CSS Absolute Unit

… und erinnere mich an Diskussionen mit HaHaWe, wieviel Px 1/16em denn wirklich sind, bz.w wieviel Pixel 6,74cm Bildschirm entspricht.

Im Wiki hatten wir den ursprünglich von @Auge entworfenen Artikel "CSS/Wertetypen/Zahlen, Maße und Maßeinheiten", der mit der Zeit immer umfangreicher wurd.

Ich habe nach Rücksprache mit Janosch neu geglidert:

• CSS/Wertetypen

  • CSS/Wertetypen/Zahlen_und_Verhältnisse

  • CSS/Wertetypen/Maßangaben

Dort geht es fast nur noch um Längenangaben.

Mir ist aufgefallen, dass unsere Tabellen sehr viel umfangreicher als die der MDN sind. Ich würde dort rigoros kürzen und dann nach den Tabellen je ein Erklärkapitel Pixel und nach den relativen Einheiten ein Erklärkapitel em/rem (in dem die jetzt bestehenden Unterseiten CSS/Wertetypen/Maßangaben/em und Wurzel-em integriert würden.

Den Abschnitt zu Prozentangaben würde ich ins erste Kapitel schieben und einen Hinweis auf height einschieben, dass sich bei Prozentangaben auf die % der Breite bezieht.

Im 3. Kapitel Schlüsselwörter_und_Zeichenketten hätte ich eigentlich eine Liste von Schlüsselwörtern wie thin, medium und thick erwartet.

Das würde ich aber gerne auch im Kapitel Maßangaben reinbringen, dass man Randbreiten eben nicht in px angeben muss. Habt ihr eine Idee, wie man das machen könnte?

Andere Ideen, evtl auch Blog-Beiträge zm Thema?

---

In der MDN gehört das Ganze zum CSS-Einstieg - bei uns fände ich das aber zu extrem und würde es gerne extra lassen.

Herzliche Grüße

Matthias Scharwies

[Gunnar Bittersmann]

@@Matthias Scharwies

In der Tabelle steht: 1 Zoll = 96px.

Warum steht bei „Pixel“ dann „varibel“ und nicht ⅟₉₆ Zoll?

Und die Einheit Q (¼ mm) wird ganz verschwiegen? Na gut, außerhalb der CSSBattle dürfte sie kaum praktische Relevanz haben. Dort aber sehr wohl! 🤓

😷 LLAP

[Matthias Scharwies]

Servus!

@@Matthias Scharwies

In der Tabelle steht: 1 Zoll = 96px.

Warum steht bei „Pixel“ dann „variabel“ und nicht ⅟₉₆ Zoll?

Danke, ist in der MDN so drin. Sollte man da Gleichheitszeichen verwenden? Ja, weil's ne Definition ist.

Aber evtl. passt ≙ oder ≅ besser?

Und die Einheit Q (¼ mm) wird ganz verschwiegen? Na gut, außerhalb der CSSBattle dürfte sie kaum praktische Relevanz haben. Dort aber sehr wohl! 🤓

Trotzdem sollte sie ihren Platz finden! wird eingefügt!

😷 LLAP

Herzliche Grüße

Matthias Scharwies

[Rolf B]

Hallo Gunnar,

In der Tabelle steht: 1 Zoll = 96px.

Das ist wohl auch hardwareabhängig. Mein Bildschirm ist 12,83 Zoll hoch bei 1200 Pixeln, das wären 93,5 Pixel pro Zoll.

Es gibt auch Monitore mit hoher Auflösung, die aber noch nicht im Retinabereich liegt, so dass man ein Devicepixel-Ratio von 2 rechtfertigen könnte (z.B. 32" mit 3840x2160 Pixel, = 137,7 Pixel pro Zoll). Ich glaube nicht, dass CSS das korrekt berücksichtigt.

Wie auch immer man das OMA-Tauglich in einem Wikiartikel packt…

Rolf

[MudGuard]

Hi,

In der Tabelle steht: 1 Zoll = 96px.

Das ist wohl auch hardwareabhängig. Mein Bildschirm ist 12,83 Zoll hoch bei 1200 Pixeln, das wären 93,5 Pixel pro Zoll.

Beamer: je nach Abstand der Projektionsfläche …

cu,
Andreas a/k/a MudGuard

[Matthias Scharwies]

Servus!

Hallo Gunnar,

In der Tabelle steht: 1 Zoll = 96px.

Das ist die Definition. Aber selbst der W3C sagt, dass das nicht mehr zutrifft:

https://wiki.selfhtml.org/wiki/CSS/Wertetypen/Maßangaben#cite_note-2

Das ist wohl auch hardwareabhängig. Mein Bildschirm ist 12,83 Zoll hoch bei 1200 Pixeln, das wären 93,5 Pixel pro Zoll.

Das ist das Thema des smashing-Artikels:

https://www.smashingmagazine.com/2021/07/css-absolute-units/

Es gibt auch Monitore mit hoher Auflösung, die aber noch nicht im Retinabereich liegt, so dass man ein Devicepixel-Ratio von 2 rechtfertigen könnte (z.B. 32" mit 3840x2160 Pixel, = 137,7 Pixel pro Zoll). Ich glaube nicht, dass CSS das korrekt berücksichtigt.

Wie auch immer man das OMA-Tauglich in einem Wikiartikel packt…

Ebent. Ich hirne noch!

Herzliche Grüße

Matthias Scharwies

[Gunnar Bittersmann]

@@Rolf B

In der Tabelle steht: 1 Zoll = 96px.

Das ist wohl auch hardwareabhängig.

Nein. 1px ist festgelegt als ⅟₉₆ Zoll.

1px (CSS-Pixel) ≠ 1 Pixel (Geräte-Pixel).

😷 LLAP

[Rolf B]

Hallo Gunnar,

du verstehst mich miss. Wenn der Monitor nicht genau 96, 192 oder 278 dpi hat, ist das devicePixelRatio (DPR) krumm. Das kommt im real life offenbar vor - siehe hier, aber das bedeutet trotzdem nicht, dass das DPR eine exakte Abbildung von 96 CSS Pixeln auf 1 Gerätezoll erlaubt. Mein Bildschirm hat 93.5 DPI, d.h. 96 Pixel sind auf meinem Bildschirm 1,03 Zoll. Er müsste eigentlich 0,974 als DPR liefern. Tut er aber nicht. Mein DPR ist 1. D.h. JavaScript hat keine korrekte Information darüber, wieviele Gerätepixel tatsächlich 1 Zoll bilden.

Keine Ahnung ob das ein "Feature" von Windows ist, um Unschärfen zu vermeiden. Denn die Abbildung von CSS Pixeln auf Gerätepixel führt bei einem DPR, der nicht ganzzahlig und unter 2 ist, zu Unschönheiten wie schwankenden Linienbreiten oder Anti-Aliasing Graustufen.

Und darum ging es mir. Die Annahme, dass der Browser die Angabe 1in exakt als ein Zoll auf den Bildschirm bringt, ist eine Idealisierung und in der Realität nicht generell zu finden.

Rolf

[Auge]

Hallo

Im Wiki hatten wir den ursprünglich von @Auge entworfenen Artikel "CSS/Wertetypen/Zahlen, Maße und Maßeinheiten", der mit der Zeit immer umfangreicher wurd.

Huch, jetzt bin ich aber verwirrt. Ich habe im Wiki doch ehedem nur ein paar Artikel aus der alten Doku und Artikelserie übertragen und im Laufe der Zeit einige Korrekturen vorgenommen. 🤔

Ich habe nach Rücksprache mit Janosch neu geglidert:

• CSS/Wertetypen

Aha. Das ist tatsächlich eine von mir aus der alten Doku übertragene Seite.

Tschö, Auge