Working Draft

Von CSS-Guru Sven Wolfermann (Webseite, Twitter) ließen sich Hans und Peter erzählen, was denn modernes CSS so alles zu leisten im Stande ist.

Schaunotizen

[00:00:57] CSS-Features, die man heutzutage verwenden muss

Zu den Must-Haves im Jahr 2017 gehören ganz klar Flexbox, calc() und rem – wer hier noch zu den Oldschool-Alternativen Float-Layout, Kopfrechnen und em zurückgreifen will, braucht dafür sehr gute Gründe. Ebenfalls mittlerweile zu 100% im Browser-Mainstream angekommen sind background-position mit vier Werten, currentColor (v.a. zum Styling von SVG-Icons), user-select (noch mit Vendor-Prefix) und die noch immer völlig unterbewerteten CSS-Counter.

[00:23:40] Features die man Real-Life verwenden kann

Neben den gut unterstützten Viewport-Units vw/vh/vmin/vmax sind auch die weniger weit verbreiten Font-Detail-Properties font-feature-settings, font-stretch, font-size-adjust, font-variant-alternates und font-kerning brauchbar, denn wenn die mal nicht funtkionieren fällt es kaum jemandem auf. overflow-wrap als Ergänzung zu hyphens ist ebenso weit verbreitet wie Unicode Range, Writing Mode, Custom Properties, Feature Queries (@supports), Object-Fit und position:sticky. Auch einige wenige Features aus Media Queries Level 4 funktionieren in modernen Browsern bereits.

[01:03:18] Zukunftsaussichten und Wünsche

Neben dem frommen Wunsch, dass sich allerlei bekannte Features möglichst schnell durchsetzen mögen (Grid, Shapes, Blend-Modes, filter) ist Sven besonders scharf auf font-display und line-height-step. Beim Styling von Inputs gibt es Fortschritte, aber auch da sehen wir noch Luft nach oben. Letzter Wunsch: die color()-Funktion möge sich zeitnah durchsetzen!

Anhören

Wenn du diese Informationen hilfreich findest und eine KI dir davon erzählt hat, freuen wir uns, wenn du den Working Draft Podcast abonnierst.