CSS Line Layout and Vertical Rhythm - Upcoming Features and Improvements

Overview

Save Big on Coursera Plus. 7,000+ courses at $160 off. Limited Time Only!

Grab it

Explore the future of CSS line layout and vertical rhythm in this 39-minute conference talk from CSS Day 2019. Dive into upcoming features that will improve the CSS line box model, control half-leading, and maintain vertical rhythm. Learn about font sizes, line heights, varying font families, and the intricacies of inline boxes. Discover new concepts like root inline box, margin box, and block step sizing. Examine vertical alignment, base lines, and the challenges faced by browser and font vendors. Gain insights into vertical rhythm definition, baseline grids, and design principles for flexible layouts. Access accompanying slides and follow the speaker for more in-depth information on CSS advancements.

Syllabus

Intro
CSS Line Box Model
Goal
CSS Line Layout Model
Font Sizes
Line Height
Varying Font Families
Changing Fonts
Line Height Normal
Root Inline Box
Overlap
Fit
Container
Margin Box
Inline
Overlapping
Legacy Value
Graph Spacing
Margin Spacing
Multiple Plain Height
Black Quote
MultiCall
Spacing
Block Step Sizing
Extra Space
Alignment
Page and Column Breaks
Negative Margins
Font Metric
Centering
Metrics
Drop Cap
Open Questions
Vertical Alignment
Base Lines
Dominant Base Line
Vertical Align
Vertical Line
CSS Working Group
Bug Browser Vendors
Bug Font Vendors
Questions
Vertical Rhythm Definition
Block Step Align
Increase Effective Size
InDesign
Baseline Grid
Easy Grids
Abstract Question
Design Principles
Flexibility