Pure CSS Francine

Astonishing.

Transcript: Intrinsic Web Design with Jen Simmons on The Big Web Show

Intrinsic Web Design is a name that I gave to this new era, because I think we’re really in a new era of layout design… I feel like we need a new word for a new era where we can say, "Oh, it’s not that float-based thing where everything’s set in widths with using percents. It’s this new set of technologies."

Display: Contents Is Not a CSS Reset

Recently I have seen cases of developers using display: contents on lists and headings to remove the margins and padding, and generally to visually do what a CSS reset might do. Essentially, they are using display: contents as a quick and dirty CSS reset. This is dangerous for accessibility.

Obnoxiously Readable Responsive Text with Viewport Units

There have been other incarnations of this style of JavaScript text resizing. But as far as I can tell, we had the option to retire all of these approaches when Viewport Units were well supported in 2012! If CSS can do the job, do the job in CSS. Delete your redundant JavaScripts, everyone!

CSS Grid: More flexibility with minmax()

By using minmax() smartly, I can actually do away with the media query altogether. I’ve tried to use minmax() to do a similar thing in the past, but without fully understanding that when I need my central columns (“tracks” in grid terminology) to be flexible, my outer columns need to be fixed, and vice versa. The key with a layout like this is to be explicit with when you want columns to be flexible and others to be fixed.