For anyone reading this who wants more information on how they work without needing to dig through the site's source code, there's a quick demo I have up on JSFiddle. This was written a while ago, I suspect there are easier ways to make this work today.
- Asides using only floats: http://jsfiddle.net/danShumway/0wqkk578/
There are a few irritations I have with the sidenotes that I want to clear up in the redesign (specifically for mobile readers), so this implementation might get tweaked a little bit in the future.
The hanging quotes are probably the part of this site I'm most proud of. They're pure HTML/CSS and render as smart quotes, but if you select the text to copy, you'll get normal straight quotes, which makes pasting into sites like HN slightly nicer and more consistent. The implementation was kind of cobbled together from a couple of other sites, and then extended to be more robust and support a few edge-case scenarios.
- Hanging quotes both at the start and within paragraphs: http://jsfiddle.net/danShumway/36jag4o2/