Skip to Content
Loading...
brain
Unfortunately, your web browser cannot use the newest technology and many of the innovative techniques we'll be using on this site won't work or won't work well. We recommend upgrading to the latest Firefox, Chrome or Edge browser for the best experience. (If you choose to stay with IE, we recommend refreshing the browser/removing your cache when anything looks funny)

Zombie Specificity Wars

Put your CSS Selectors head to head!
Your job: Stop the horde one CSS selector at a time.
Show Instructions

This game works like the card game War i.e. you and the zombie you're fighting each put out a card. (You can click and drag/tap and drag on most devices, but on some touchscreens you'll need to double tap to choose your card instead of dragging.) The card with the highest specificity wins a point. There are a few twists, however.

  1. You can pick from one of five cards to play. (It's not blind like with War)
  2. After the cards have been played, you can guess whether the specificity is lower, higher or the same. You earn a point if you answer correctly.
  3. If the specificity is equal, no one wins a point for the fight, but you can still get a point if you guess the specificities are equal.
  4. To win, you need 26 more points than the zombie (not 52 cards ahead like in War).
  5. A winner is only declared after every five battles. So even if the zombie gets ahead by 26 points, you have until the end of the five battles to turn things around.
  6. If you win, you can claim a free set of CSS cheat sheets from the Undead Institute store ($1.99 value).
  7. If you lose a zombie eats your brain.

Your card's specificty is

Zombie Score:
0
vs.
Your Score:
0
top

Enjoyed Zombie Specificity Wars?

Sign up for our newsletter, Webpocalypse Weekly, and Get Punching Zombies: An HTML & CSS Quickstart Guide for Writers, Designers, and Beginners for free.