flexbugs

Flexbugs is a community-maintained collection documenting bugs in CSS flexbox and the workarounds available for each one. Flexbox is a CSS technique for arranging elements on a webpage in rows or columns, controlling spacing, alignment, and sizing. However, different web browsers implemented flexbox in slightly different ways, and some browsers had outright bugs where the layout did not behave as the specification required.

The repository lists 17 confirmed bugs, each with a description of what the bug is, which browsers are affected, links to live demo pages showing both the broken behavior and the working workaround, and links to the official browser bug tracking tickets where available. Examples include flex items shrinking smaller than they should, min-height on a flex container not affecting its child elements in Internet Explorer, flex-basis ignoring box-sizing calculations, flex-basis not supporting calc() expressions, and certain HTML elements like fieldset and button not being valid flex containers.

Each bug entry is numbered and the associated demo pages let you observe the broken and fixed states side by side in your current browser. Most entries also include a plain-English explanation of why the bug occurs and what the workaround does to correct the visual result without altering the intended design.

The README notes that this repository is no longer maintained, because most of the listed bugs have since been fixed in modern browsers. It remains a useful historical reference for anyone who needs to support older browser versions or who encounters an unexpected layout problem that may trace back to one of these documented quirks.

The project itself contains no installable code. It is a documentation resource consisting of the README and linked demo files.

The full README is longer than what was shown.