CSS Diner is Slowly Killing Me

[EDIT 4/7/2014] Hey – I did figure it out. You can stop commenting me the answers now. KTHX. :P

One of my Automattic colleagues turned me onto the site CSS Diner, which touts itself as “a little game to help you learn CSS selectors.”

It’s been great thusfar! While I’m pretty good with CSS, I’ve always struggled with the more advanced selectors and how to properly implement them. This little game, for me, has been fantastic in helping “stick” those rules in my head. Until I got to level 17, that is. The dreaded :last-child selector.

I was able to suss out how to select the apple on the fancy plate…but that goddamn pickle…

pickle-rage

Now don’t mistake this as a “cry for help” because I do want to figure it out on my own. For me, that’s the best way to learn new things: you keep trying until you get it.

And in my case, it may involve some head-trauma as I bang my head on my desk in frustration. :D

I’d love to hear your recommendations on more advanced CSS trainings! Free is even better.

4 comments

    1. I usually use syntax
      .small:last-child
      for stuff like this because usually you first target all “small” targets and then select only the last one as a special case. However, if you had some rules for all last childs and then want to special case the “small” case, using the syntax
      :last-child.small
      would make more sense.

  1. I like the CSS Diner, but I wish it would provide directions/feedback when I’m wrong or more helpful tips in learning.

Got something to say?