Skip to content

Vincenius/css-speedrun

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

52 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

CSS Speedrun

A small fun app to test your CSS knowledge. Find the correct CSS selectors for the 10 puzzles as fast as possible.

https://css-speedrun.netlify.app

Setup

  • Install the app with npm i
  • run npm run build to create the dist directory
  • run npm run watch to run the dev server and watch for changes

Create your own puzzles

To create your own puzzles check the files in /src/js/puzzles.

They contain the code for the puzzle and an array to mark which lines should be selected. Also you can provide an optional hint to help others solve your puzzle.

Solutions

Answer list: Intro: li:first-child
  • Level 1: p:not(.foo)
  • Level 2: li:nth-child(2n + 3)
  • Level 3: div > *
  • Level 4: span[data-item]
  • Level 5: p ~ span
  • Level 6: :enabled
  • Level 7: #one, #two, #five, #six, #nine
  • Level 8: a + span
  • Level 9: #foo > .foo
  • Level 10: div div span + code:not(.foo)

License

MIT


created by Vincent Will