This is a post in response to Eric Meyer‘s post Infinite Pixels which takes some trouble to play with calc and Infinity and what those actually work out to in the real world. Infinity is one of those math ideas that also has fanciful implications. And since I learned about it some months ago they’ve been on my mind. Read about them on MDN: infinity, calc()

I’ve been thinking about this “Infinity” keyword in CSS for a few months and here’s some citations and thoughts in response. The implementation details are arbitrary, as your calculations show. Implementors are choosing what that viewport can reckon with as it tries to show what actually exists. I’m reminded that I can remember creating single frame frame sets that called the same page and how for a while I could get a browser to crash like that. Eventually they got wise and got that to stop. I also remember creating a image that was 2000 pixels wide ad 1 pixel tall to create a background and some browsers deciding that to make that image repeat (pre-CSS) they would render it again and again once at a time until the browser crashed. They gotta set limits because we we developers will break stuff.

All that said, I’ve had The canvas sections of the CSS Level 2 spec bookmarked and have been comparing them. In the 1997 edition, 8.3.1:

For all media, the term canvas means “the space where rendering objects are rendered” (see the CSS2 process model). For a screen, the canvas is a rectangular space generally of fixed width and “infinite” length. For paged media, the canvas is a sequence of rectangular page boxes of fixed width and height. For aural media, the canvas is a three dimensional audio space.

And in 1998 it’s a bit changed 2.3.1. They rethought about what the canvas was and introduced the viewport which helps implementors reconcile infinite possibility with finite screen space and memory. I find the following passage beautiful: I’m that weirdo.

For all media, the term canvas describes “the space where the formatting structure is rendered.” The canvas is infinite for each dimension of the space, but rendering generally occurs within a finite region of the canvas, established by the user agent according to the target medium. For instance, user agents rendering to a screen generally impose a minimum width and choose an initial width based on the dimensions of the viewport. User agents rendering to a page generally impose width and height constraints. Aural user agents may impose limits in audio space, but not in time.

And that language persists, along with the use of the word “infinite” with the 2016 edition. And that word, stuck in my head for a week or so after Comic-Con, and I tracked down a copy of Scott McCloud’s 2000 book “Reinventing Comics.” On pages 222-223 he explicitly talks about the infinite nature of digital spaces:

–but gradually, comics creators will stretch their limbs and start to explore the design opportunities of an infinite canvas. In a digital environment, there’s no reason a 500 panel story can’t be told vertically — or horizontally like a great graphic storyline.

The notion that beyond those viewports we carry in our pockets is an infinite space we need only tease into view with HTML and CSS appeals to my sense of the inherent power and possibility of making web pages.

Go make a web page, y’all.