whatisgithub

What is wtf-html-css?

mdo/wtf-html-css — explained in plain English

Analysis updated 2026-07-22 · repo last pushed 2022-03-04

1,447CSSAudience · vibe coderComplexity · 1/5DormantSetup · easy

In one sentence

A community-curated guide to common HTML and CSS mistakes and quirks that break web pages. It explains why layouts misbehave and how to fix them, without teaching coding from scratch.

Mindmap

mindmap
  root((repo))
    What it does
      Lists common CSS mistakes
      Explains layout quirks
      Troubleshooting guide
    Audience
      Vibe coders
      Product managers
      Founders
    Use cases
      Fix broken layouts
      Build personal portfolio
      Tweak landing pages
    Community
      Open contributions
      Multiple translations
      Real-world problems

Code map

Detail Auto

An interactive map of this repo's files and how they connect — its source is parsed live in your browser. Click Visualize to build it.

filefunction / class

What do people build with it?

USE CASE 1

Look up why your CSS layout broke and find the fix in plain language.

USE CASE 2

Build a personal portfolio without getting stuck on confusing styling behavior.

USE CASE 3

Tweak a landing page and quickly resolve common centering or spacing issues.

USE CASE 4

Contribute a new gotcha you encountered so others can avoid the same frustration.

What is it built with?

CSSHTML

How does it compare?

mdo/wtf-html-csskarpathy/karpathy.github.iogustavoguanabara/php-moderno
Stars1,4471,656558
LanguageCSSCSSCSS
Last pushed2022-03-042026-04-102023-08-09
MaintenanceDormantMaintainedDormant
Setup difficultyeasyeasyeasy
Complexity1/52/51/5
Audiencevibe coderwritervibe coder

Figures from each repo's GitHub metadata at analysis time.

How do you get it running?

Difficulty · easy Time to first run · 5min

No setup needed, it's a readable curated document, just open and browse.

No license information is provided in the repository, so usage terms are unclear.

So what is it?

WTF, HTML and CSS? is a curated list of the common mistakes, quirks, and frustrating moments that trip people up when building web pages. If you've ever styled a button and watched it inexplicably push your entire layout out of place, or spent an hour trying to center a simple image, this is the resource that explains why that happened and how to fix it. At a high level, the project is a living document of pitfalls. It covers situations where web browsers interpret code differently than you'd expect, or where the underlying rules of web design behave in counterintuitive ways. Rather than teaching you how to code from scratch, it serves as a troubleshooting guide you can turn to when your page looks broken and you're not sure which rule is causing the problem. This is primarily aimed at people who write web pages but don't necessarily consider themselves senior developers, which makes it perfect for vibe coders, product managers, or founders who occasionally tinker with front-end code. If you're building a personal portfolio, tweaking a landing page, or adjusting the look of an existing site, you'll inevitably run into confusing behavior. This guide helps you skip the frustration of searching for answers by gathering those common dilemmas in one place. The project is notable for its community-driven approach and global reach. Anyone can suggest additions or improvements through the standard contribution process, which means the list reflects problems that real people actually encounter, not just theoretical issues. It has also been translated into several languages, including French, Spanish, Russian, and Chinese, reflecting how universal these web development headaches are across the world.

Copy-paste prompts

Prompt 1
My CSS button is pushing the entire layout out of place, look up the WTF HTML CSS guide and explain what common mistake causes this and how to fix it.
Prompt 2
I spent an hour trying to center an image with CSS and it won't work. Use the WTF HTML CSS resource to explain why this is a common pitfall and give me the correct approach.
Prompt 3
I'm tweaking a landing page and something in my CSS is making the page look broken. Check the WTF HTML CSS list of common quirks and help me identify which rule is causing the problem.
Prompt 4
I want to contribute a new HTML or CSS gotcha to the WTF HTML CSS repo. Help me write a clear explanation of the problem, why it happens, and the fix.

Frequently asked questions

What is wtf-html-css?

A community-curated guide to common HTML and CSS mistakes and quirks that break web pages. It explains why layouts misbehave and how to fix them, without teaching coding from scratch.

What language is wtf-html-css written in?

Mainly CSS. The stack also includes CSS, HTML.

Is wtf-html-css actively maintained?

Dormant — no commits in 2+ years (last push 2022-03-04).

What license does wtf-html-css use?

No license information is provided in the repository, so usage terms are unclear.

How hard is wtf-html-css to set up?

Setup difficulty is rated easy, with roughly 5min to a first successful run.

Who is wtf-html-css for?

Mainly vibe coder.

Open on GitHub → Ask about another repo

This repo across BitVibe Labs

Verify against the repo before relying on details.