Skip to content

Instantly share code, notes, and snippets.

@chrisman
Created August 2, 2017 18:21
Show Gist options
  • Star 24 You must be signed in to star a gist
  • Fork 15 You must be signed in to fork a gist
  • Save chrisman/fcb0a88459cd98239dbe6d2d200b02d1 to your computer and use it in GitHub Desktop.
Save chrisman/fcb0a88459cd98239dbe6d2d200b02d1 to your computer and use it in GitHub Desktop.
solutions for css diner
# https://flukeout.github.io/ #
01. plate
02. bento
03. #fancy
04. plate apple
05. #fancy pickle
06. .small
07. orange.small
08. bento orange.small
09. plate, bento
10. *
11. plate *
12. plate + apple
13. bento ~ pickle
14. plate > apple
15. orange:first-child
16. plate apple:only-child, plate pickle:only-child
17. .small:last-child
18. plate:nth-child(3)
19. bento:nth-last-child(3)
20. apple:first-of-type
21. plate:nth-of-type(even)
22. plate:nth-of-type(2n+3)
23. plate apple:only-of-type
24. orange:last-of-type, apple:last-of-type
25. bento:empty
26. apple:not(.small)
27. *[for]
28. plate[for]
29. bento[for="Vitaly"]
30. *[for^="Sa"]
31. *[for$="ato"]
32. bento[for*="obb"]
@JanDirkKoersma
Copy link

  1. plate :only-child

@idembele70
Copy link

Thanks Your a Gem

@DZN1636
Copy link

DZN1636 commented Apr 4, 2021

Thanks for the awesome work. Can someone explain why 19. bento:nth-last-child(3) worked? For me it seems like it's the 2nd bento backward, so I think about bento:nth-last-child(2) instead.

EDIT: found the answer: flukeout/css-diner#205

@Usiel-03A7
Copy link

16.- plate :is(apple, pickle)

@kobi2132
Copy link

kobi2132 commented Oct 3, 2021

  1. bento:nth-last-child(3)
    why 3 and not 2?

@idembele70
Copy link

yea kobi2132, i thinked the same, but i think with nth child, if other item is as the same level of a child then it counted, i don't know if you understand my explanation

@Yes-07
Copy link

Yes-07 commented Apr 28, 2022

( 16. plate :only-child ) doesn't work

It's supposed to be
plate>:only-child()
Don't know if they missed the greater than symbol or is it just their keyboard that's acting up

And uhh if you already know it then congratulations!

@2HEADSs
Copy link

2HEADSs commented May 3, 2022

  1. plate :only-child

try by yourself

@V3R0S3
Copy link

V3R0S3 commented Aug 11, 2022

thanks

@q92helea
Copy link

q92helea commented Oct 29, 2022

( 16. plate :only-child ) doesn't work

This is plate [SPACE]:only-child.
This isn´t plate:only-child.

@diegoferraribruno
Copy link

  1. bento + pickle, pickle + pickle

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment