WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
World Congress 2022 • Jun 15, 2022

Can CSS recreate Tufte's designs?

Håkon Wium Lie

Can modern CSS replace InDesign for high-end print publishing? Discover how to programmatically recreate Edward Tufte’s famously complex book layouts using just HTML and CSS.

Pause
Mute Enter Fullscreen
#1 about 2 min

Recreating complex print layouts with CSS technologies

How standard web formats can replace expensive design software for generating high-quality printed publications.

#2 about 4 min

Bridging scientific structure and typography with CSS

The historical evolution from early unstyled web pages to the adoption of print-inspired cascading style sheets.

#3 about 5 min

Establishing physical book layouts with CSS paged media

Using CSS rules to define physical document dimensions, margin scales, and dynamically generated running headers.

#4 about 7 min

Structuring side notes and figures using page floats

Extending baseline float declarations to reliably position elements against physical page edges and designated margin spaces.

#5 about 4 min

Spanning continuous images across a two-page printed spread

Generating selectable PDF elements and leveraging duplicate overlap hacks to simulate smooth image continuity across separated physical pages.

#6 about 2 min

Recognizing the limitations of CSS for optical alignment

Why manual human adjustments remain necessary for fine-tuning layout elements that appear visually flawed despite mathematical accuracy.

#7 about 4 min

Adapting complex print configurations for interactive screen browsing

Applying responsive behavior and supplemental scripts to collapse static print margins into accessible screen interactions.

#8 about 3 min

Automating typography adjustments with CSS text replacements

Injecting specialized Unicode punctuation using automated style substitution to enforce strict typographic standards.

Matching moments

58 sec

Formatting printable documents with page media CSS

Chris Heilmann +2 · LIVE

2:04 min

Introduction to modern CSS capabilities for designers

Onur Gumus · LIVE

2:55 min

Evaluating the future utility of CSS Houdini web standards

Tanja Ulianova · World Congress 2023

1:01 min

Understanding the fundamental role of CSS in web development

Patricio Vargas · LIVE

3:37 min

Responsive layout challenges and user customization

6:37 min

Strategies for keeping up with advanced CSS evolution

Onur Gumus · LIVE

More from World Congress 2022

What the heck do "declarative" and "reactive" actually mean? thumbnail
30:40
about 4 years ago

What the heck do "declarative" and "reactive" actually mean?

André Kovac

The Design and Evolution of C++ thumbnail
1:01:15
about 4 years ago

The Design and Evolution of C++

Bjarne Stroustrup

But, you're not Facebook thumbnail
31:12
about 4 years ago

But, you're not Facebook

Kristijan Ristovski

Communicate efficiently with Software Architecture Diagrams thumbnail
28:11
about 4 years ago

Communicate efficiently with Software Architecture Diagrams

Simon Lasselsberger

Get Ready for Jakarta EE 10! thumbnail
42:53
about 4 years ago

Get Ready for Jakarta EE 10!

Ivar Grimstad

Keep your code refactorable thumbnail
26:46
about 4 years ago

Keep your code refactorable

Gerrit Stapper

Upcoming sessions on this topic

Open session

World Congress 2026 North America

September 24, 2026 · 12:50–13:20

Stage 7

Architecting AI in Angular: WebMCP, A2UI, and the Agent Experience

Ankita Sood

Sr. Principal Engineer @ Secureworks | Angular GDE

Ankita Sood
Open session

World Congress 2026 North America

September 25, 2026 · 12:55–13:25

Stage 5

Content Platforms: The Bottleneck Is Responsibility, Not Tech

Daniel Fau, Tom Warwick

Daniel Fau
Tom Warwick
Open session

World Congress 2026 North America

September 24, 2026 · 16:00–18:00

Stage 10

Reprompting the Wheel? Why AI Won’t Save Your Content Platform

Benni Mack

TYPO3 CMS Project Lead at TYPO3

Benni Mack
Open session

World Congress 2026 North America

September 24, 2026 · 14:50–15:20

Stage 3

Why AI-Written Books Fail – and How We Made Quality Measurable

Hannes Steiner, Thomas Neumayer

Hannes Steiner
TN
Open session

World Congress 2026 North America

September 24, 2026 · 10:20–10:50

Stage 1

The Browser Is Becoming an AI Runtime

Ajit Varma, Will Bryk

Ajit Varma
Will Bryk
Open session

World Congress 2026 North America

September 25, 2026 · 11:00–11:30

Stage 6

Secure-by-Inclusion: Preventing Accessibility Barriers from Becoming Security Vulnerabilities

Radostina (Ina) Tsvetkova

Norwegian Directorate of Labour and Welfare (NAV), Senior Advisor in Digital Accessibility and Inclusive Design

Radostina (Ina) Tsvetkova

Related videos

What's new in CSS for Designers? thumbnail
59:20
LIVE • almost 3 years ago

What's new in CSS for Designers?

Onur Gumus

WeAreDevelopers LIVE - Web Typography; CSS Layout features; Staying curious in an AI world and more thumbnail
1:10:55
LIVE • over 1 year ago

WeAreDevelopers LIVE - Web Typography; CSS Layout features; Staying curious in an AI world and more

Chris Heilmann, Daniel Cranney, Jason Pamental

WeAreDevelopers LIVE - CSS or BS? thumbnail
52:59
LIVE • 5 months ago

WeAreDevelopers LIVE - CSS or BS?

Chris Heilmann, Daniel Cranney, Keith Cirkel

Future-Proof CSS thumbnail
37:55
World Congress 2022 • about 4 years ago

Future-Proof CSS

Ire Aderinokun

WeAreDevelopers LIVE - CSS is DOOMed thumbnail
1:01:17
LIVE • 5 months ago

WeAreDevelopers LIVE - CSS is DOOMed

Chris Heilmann, Daniel Cranney, Niels Leenheer

Designing for Every Direction: Logical CSS for Global, Adaptive, and Effortlessly Reversible UIs thumbnail
33:03
Europe 2026 Virtual • 2 months ago

Designing for Every Direction: Logical CSS for Global, Adaptive, and Effortlessly Reversible UIs

Vidhya Krishnamoorthy

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.