CSS Hell
Stefánia Péter
The site provides a comprehensive collection of common CSS mistakes, along with detailed explanations and step-by-step guides on how to fix them.
CSS Hell is not an ordinary educational site. I try to help people understand CSS in a more entertaining, fun way because, in my belief, if something evokes emotion, we tend to memorise it better. I'm currently working as a web developer since 2010 but started this whole journey in 2003, so basically, the web, coding standards and frameworks evolved in front of my eyes. Safe to say, I saw a quiet few things. The most common recurring issues are usually related to HTML and CSS. The HTML part is covered by Manuel Matuzović with HTMHell. After discussing my idea with him, I've created a similar project for CSS.
All the examples found on the site are from live codebases in production. With this approach, I try to ensure that people can relate to these mistakes, and it's not just something I came up with. I pay attention to not to hurt anyone, so I usually rename the classes, use different units, to ensure that no one can identify who's code it was. We are all learning here, no one did anything wrong, it's just there are always better solutions that can help you improve and save time.
Every issue has a bad and a good example with a short explanation and resources to read more if you are interested.
Other people can also contribute to the project by fixing bugs, adding enhancements, or creating a new post. CSS Hell is open source and never going to have ads! I want to give something back to the community which helped me to learn and improve myself to advance my career.
Technical details
The site is built with eleventy, and deployed by Netlify. I want to keep it as simple as possible because not every project requires the latest flashy new technology with overcomplicated methods.
Links
- Website: csshell.dev
- GitHub: github.com/cat-a-flame/CSSHell
- Twitter: x.com/css_hell