Hacksplaining teaches secure coding through interactive browser lessons covering OWASP Top 10 and GenAI threats.
Freemium
24 alternativesCSS Diner
CSS Diner teaches CSS selectors through an interactive lesson that presents selector examples in a game format.
About CSS Diner
CSS Diner is an interactive lesson for practicing CSS selectors. Users type a selector in the CSS editor to select the correct items on the table, and a correct selection advances to the next level.
The page shows related code in an HTML viewer, allows hovering over table items to see their markup, and provides selector help and examples. Users can jump to a level by typing its number, choose levels from a list, and reset progress.
Key features
- Type CSS selectors in editor to select table items
- Advance to next level after correct selection
- Hover over table items to view HTML markup
- View related code in built-in HTML viewer
- Access selector help and examples alongside lessons
- Skip to level by typing number, choose level, reset progress
Best for: Beginners who want to practice selecting HTML elements with CSS selectors.
Good for
- Hands-on practice by typing selectors to solve levels
- Shows HTML markup when hovering over table items
- Includes selector help with level selection and reset
CSS Diner at a glance
- Website
- flukeout.github.io
- Category
- Education & Learning › Learn to Code
- Type
- Website
- Pricing
- Not confirmed. Check the site
- Platforms
- Web
- Open source
- Not stated
- Last checked
- Oct 5, 2026 · Online when checked
- Listed
- Oct 5, 2026
CSS Diner alternatives
Tools and sites you could use instead, ranked by how closely they match.
RegexOne teaches regular expressions through interactive lessons and exercises.
Crafting Interpreters is a book about building programming languages, with lessons and examples for interpreters.
RegexLearn teaches regular expressions through interactive lessons and practice at different levels.
FreeOpen source
24 alternatives
The interactive HTML Cheat Sheet includes code examples, developer tools, and markup generators.
DOM Events visualizes the Document Object Model event system through interactive examples.
Popular in Learn to Code
Well-known listings from the same topic.
Codelabscodelabs.developers.google.comScratchscratch.mit.eduTelegram Bot APIcore.telegram.org/botsStudent Developer Packeducation.github.com/packQB64SourceCodeqb64tutorial.comCodeAbbeycodeabbey.com
CSS Diner FAQ
How do I play CSS Diner?
Type a CSS selector in the editor to select the correct items on the table. A correct selection advances to the next level.
How can I see the HTML for items on the table?
Hover over the items on the table to see their HTML markup, which is also shown in the HTML viewer.
How do I jump to a specific level?
Type the level number in the editor, for example "5" for level 5. You can also choose a level from the level list.
Is something wrong or out of date?
Tell us and an editor will check it.
Own this website?
Claim this listing
Claim the listing and suggest updates yourself. An editor checks every claim first.