CASPAR.green

That's just, like, my opinion, man.

You are here: Home / Archives for CSS Grid

CSS Grid

CSS Refresher: @supports

by

Last week, on the coat tails of inspiration gathered from WordCamp Rochester, I ordered Eric Meyer’s mammoth new book – CSS, The Definitive Guide, 4th edition. It came on Wednesday afternoon and I managed to read the first chapter on Wednesday evening before the Thanksgiving festivities set in.

I’ve read enough of these kinds of books now that I’ve gained a sense of which ones are good and which are not so good. This one is starting off in the good column. The presentation flows. The examples are simple enough to grasp quickly without being artificial or contrived.

I’ve been doing CSS for a long time. I like to think that I’m pretty good at it. But even in the first chapter, I learned a few things. Aside from the several moments of “Aha! I already knew how to do that, but this is what’s really happening under the hood and why”, I learned about the @supports rule.

I’m not going to try to explain @supports here. You can google it (or get Meyer’s book) for the full story. But I’ve been wondering, for example, how to use CSS grid when I still have to support older browsers that don’t implement it. Enter @supports:

@supports ( display: grid ) { ... }

With this, browsers that use the grid will use it. Anything else will ignore it and just use the old gridless styles. Problem solved in 1 line of code. Mind blown.

I probably would have figured this out eventually. But becoming aware of it and having a clear explanation of it was worth the price of the book. And I’ve only read Chapter 1, so far.

Cudos to Eric. I’m looking forward to Chapter 2.

WordCamp Rochester 2017 Wrap-up

by

I spent last Saturday at WordCamp Rochester. Props to the volunteers and coordinators that made it happen. It was a good day:

  • I got a couple of ideas from Matt Graham’s presentation on “HTML in Functions Kills Kittens”.
  • Tracy Finifter Rotton inspired me to dig deeper into CSS Grid. “Friends don’t let friends use floats for layout.”
  • Lee Hurst gave a demo of Google Data Studio that opened up a huge new horizon for me.

WordPress Themes and MVC (or lack thereof)

I’ve been thinking about WordPress themes lately: cleaning up a legacy theme in my spare time, watching the new Beans theme framework develop, growing more dissatisfied with the WordPress “spaghetti and meatballs” in general. Matt’s presentation, a kind of 35,000 ft view of opportunities for implementing a more MVC pattern within WordPress made a lot of sense and pointed towards a few patterns to try in my future exploration.

CSS Grid

Since Eric Meyers CSS Definitive Guide, 4th edition dropped last month, I’ve had my mind on the extent to which that technology has changed even in just the past year or so. Most notably, the new Grid specification has finally been fully implemented in the MS Edge browser — which makes it realistic to actually use it on new sites. But the Definitive Guide is a huge book, and I’d been on the fence about whether to actually dive in. I’d dabbled with Grid over the last couple months, but Tracy’s demo convinced me that now is the time to take the plunge.

Google Data Studio

OMG. You mean I can import whatever data I want however I want into a widget without coding the whole damn API myself! Holy crap! This changes everything. Big thanks to Lee for fleshing out what all the commotion is about.

What’s Next

I’ve realized that I, too, have a few things I’ve learned over the years that I need to be more proactive about sharing. So the last thing about the WC Rochester experience left me with is the itch to submit a talk or two of my own for a few upcoming WordCamps. Object Oriented WordPress Themes anyone?