Ich erinnere mich, wie ich auf dem Rücksitz des Kombis unserer Familie saß. Ich war sechs und das war lange bevor Kindersitze erfunden wurden. Mein Vater fuhr und meine Mutter spielte 20 Fragen mit mir, während wir zu einem Urlaubsort fuhren, an den ich mich nicht einmal erinnern kann.

Es war die Reihe meiner Mutter, als sie und ich 20 Fragen spielten. Sie hatte ein Objekt im Sinn und ich stellte die Fragen.
"Ist es groß?" fragte ich.
"Relativ wozu?" antwortete meine Mutter.
Das war das Muster während des gesamten Spiels. Ich stellte eine Frage und meine Mutter antwortete mit einer Frage zur Relativität.
"Du kannst Fragen stellen, wenn ich an der Reihe bin, mir ein Objekt auszudenken", sagte ich.
"Wenn du fragst, ob die Sache so groß ist wie ein Berg, ist die Antwort nein. Aber neben einer Ameise, ja, sie ist groß."
Dieses Jahr war eine lange Zeit des erneuten Lernens, was es bedeutet, relativ zu denken. Wie lange? Das ist relativ, nehme ich an. Aber da 2020 zu Ende geht, kann ich meine Mutter fast dieselbe Frage stellen hören, sei es bei der Arbeit oder in meinem persönlichen Leben.
"Relativ wozu?" fragt sie.
Mein Geist springt zu **relativen Einheiten in CSS**, wenn ich das Wort "relativ" höre. Ich bin sicher, vielen von Ihnen geht es genauso. Ich greife ständig zu Dingen wie em, rem und % bei meiner Arbeit. Ich habe angefangen, sie nur zu benutzen, um cool zu sein, als ich sie zum ersten Mal kennenlernte (wann auch immer das war). Ich wusste nicht einmal, dass es einen echten Unterschied zwischen em und rem gab. Ich dachte, sie hätten etwas mit Retina-Bildschirmen zu tun.
Natürlich ist das lange her. (Wie lange? Das ist relativ.) Ich weiß jetzt, dass relative Einheiten *relativ zu dem Ding sind, auf das sie sich beziehen*. 2rem wird auf einer Website mit einer Schriftgröße von 16px anders ausgewertet als auf einer Website mit 24px. Dasselbe gilt für Prozente. 50% in einem 400px Container bedeuten etwas anderes als 50% in einem 1200px Container.
Wenn ich also jetzt Werte für Elemente zuweise, führe ich zuerst ein kleines Gespräch mit meiner Mutter.
"Dieses Element ist 5.25em."
"Relativ wozu?" fragt sie.
Ich habe auch gelernt, dass **relatives Denken ein wenig Perspektive erfordert**. Und nein, das hat nichts mit CSS perspective zu tun (obwohl ich versuchen könnte, die Verbindung herzustellen). Relativ zu denken bedeutet, kurzzeitig aus seinen eigenen Schuhen zu steigen und die Dinge aus der Sichtweise eines anderen zu betrachten.
Ich sage "etwas", weil ich am meisten darüber nachdenke, wenn ich Code schreibe. Wann immer ich an den Teilen einer Komponente arbeite, muss ich den Kontext – oder die Perspektive – berücksichtigen, wo sie sitzen. Warum? Weil die Teile in verschiedenen Kontexten unterschiedliche Bedeutungen haben und diese Kontexte relativ zu der Komponente sind, die sie enthält.
Wann ist ein <h2> nur ein <h2>? Kaum jemals. Es könnte der Name des Beitrags sein. Oder vielleicht die Überschrift eines Widgets. Vielleicht ist es die Überschrift einer Kartenkomponente. Als Frontend-Entwickler benennen wir diese Dinge entsprechend der Perspektive der Komponente. Aus der Perspektive eines Beitrags bedeutet (und sieht wahrscheinlich) ein <h2> etwas anderes als aus der Perspektive, sagen wir, einer Karte.
.post {}
.post__title {}
.widget {}
.widget__title {}
.card {}
.card__title {}
Benennung ist schwierig. Ich ertappe mich oft dabei, wie ich denke: * "Ach! Was zur Hölle soll ich diesem Ding nennen?"*
"Relativ wozu?" unterbricht meine Mutter.
Ich könnte ewig so weitermachen. Die Wahrheit ist, dass das Denken in Bezug auf Relativität für den Code, den wir schreiben, genauso wichtig ist wie für ein Spiel von 20 Fragen oder sogar für unser persönliches Leben. Und in einem Jahr, in dem wir von so vielen konkurrierenden Kräften aus dem Gleichgewicht gebracht wurden, kann das Denken in diesen Bahnen Trost und Weisheit inmitten von dem bieten, was für viele von uns stressig und frustrierend war – relativ gesehen, natürlich.
- "Das stresst mich." Relativ wozu?
- "Ich habe so viel zu tun." Relativ zu wann?
- "Ich bin schlecht in JavaScript." Relativ zu wem?
- "Ich hasse meinen Arbeitsplatz." Relativ zu wo?
Es ist leicht, sich in Absolutheiten zu verstricken. Relativität zwingt uns, die Dinge anders zu sehen.
Danke, Ihr Beitrag ist ein schönes Ding, relativ zu all den nützlichen Beiträgen über CSS, weil Sie eine wunderbare (und noch nützlichere) Verbindung zum Leben herstellen. Bitte sagen Sie Ihrer Mutter vielen Dank
Es war erfrischend, das zu lesen, Geoff.
Wirklich, irgendwie habe ich mich heute selbst eine Frage (einen Zweifel, schätze ich) zur Arbeit gestellt, und Ihre Mutter hat die Antwort so viel klarer gemacht.
2020 war für uns alle an jeder Front extrem hart, privat oder beruflich. Und jetzt, da wir es überstanden haben (glücklicherweise? Weiß nicht), werden wir alle Zweifel, einige Fragen haben, aber die Weisheit Ihrer Mutter wird sicherlich vielen Lesern dieses Artikels helfen (genauso wie mir).
„Relativ wozu?“
Sie haben die Gelegenheit verpasst,
position: relative;hier zu erwähnen :-)Geoff, du hast einen Punkt verpasst, wie auch der vorherige Kommentar besagt.
Mehr noch, ich bin mir nicht sicher, ob Sie sich jemals gefragt haben, warum die W3C-Arbeitsgruppe uns bei der Verwendung von Position etwas wie in der griechischen Sprache gegeben hat (wo Ja tatsächlich als Nein gehört und Nein Ochee heißt, sozusagen umgekehrt....).
Das liegt daran, dass wir, wenn wir die Position eines inneren Elements, div, p, wie Sie wollen, einstellen, es "absolut" nennen, was ziemlich absurd ist, wenn man bedenkt, dass die Position dieses Elements tatsächlich vom Browser RELATIV zu seinem Container /oder vorherigen Geschwisterelement/ berechnet wird, nicht umgekehrt...
Und um die Sache noch schlimmer zu machen, wird der Container in der heutigen Syntax als relativ zu seinem Kind betrachtet – anstatt als absolut, wie es sein sollte...
Eine schlechte Wortwahl, meiner Meinung nach, die die Bedeutung der Semantik untergräbt – die meiner Meinung nach der beste Weg ist, unser Verständnis und unsere Absichten beim Schreiben von Code auszudrücken.
Und wenn Sie mir sagen wollen, dass die Benennung als Relative vielleicht beabsichtigt war (korrekt!) als eine Möglichkeit, es auf seinem eigenen Vorfahren zu positionieren, werde ich Ihnen sagen, dass die Position-Benennung auf die gleiche Weise wie bei Flex hätte gesetzt werden müssen. Mit anderen Worten, ein und dasselbe div kann flex: 1 für seinen eigenen Container haben, aber auch display: flex für seine eigenen Kinder.
Sowohl enthalten ALS AUCH enthaltend (andere), richtig?
Daher wurde Ihre Regel "Alles ist relativ" leider absurd zu ... demselben plus "Oder absolut" geändert.
Es ist kein Wunder, dass manchmal (oder ziemlich oft) kluge Leute eigene Sprachen/Bibliotheken erfinden, wenn sie eine solche mangelnde Sorgfalt in Bezug auf die grundlegendsten Konzepte sehen.
Viele Sprachen verwenden Fehlerbehandlung, aber sehen Sie, wie anmutig Go im Vergleich zu Node ist. Aber wenn man einen echten [Namens-]Fehler macht und uns alle Entwickler zwingt, ihn tagtäglich in CSS zu verwenden?! Das finde ich ziemlich empörend :)
Was denkst du?
Wäre es nicht besser, einfach position:absolute für das Elternteil / großen Bruder / und position:relative für sein Kind / kleinen Bruder / (gefolgt von irgendwelchen top oder left Sachen, natürlich) zu setzen?
Ich würde den CSS-Machern eine großartige Zeile aus einem schönen Film sagen: [ein Kind Absolut statt Relativ zu nennen] das war wirklich dumm für wie schlaue Jungs ihr seid!
Danke :)
Was denke ich? Ich bin vollkommen zufrieden mit den
position-Schlüsselwortwerten. Die genaue Semantik stört mich nicht, solange wir wissen, wovon unsere Offset-Werte relativ sind und wie sie ausgewertet werden.