CSS framework or responsive utility is configured
Why it matters
A project with no responsive CSS primitives — no Tailwind config, no media queries, no Flexbox or Grid — is shipping a fixed-layout site. Every viewport outside the single width the developer tested will render with broken spacing, cut-off content, or awkward whitespace. Retrofitting responsiveness after the fact is significantly more expensive than adopting a responsive system from the start, because every component needs to be re-evaluated.
Severity rationale
Medium because static layouts are recoverable but require rework across every component touched.
Remediation
Adopt Tailwind CSS as the default path — it installs in under a minute and produces responsive classes out of the box. Configure it via npx tailwindcss init -p and add the directives to your globals.css. If Tailwind is off the table, add media queries to your global stylesheet.
npm install -D tailwindcss postcss autoprefixer
npx tailwindcss init -p
DetectionPro
The detection method for this pattern is part of AuditBuffet Pro.
The full method (what to look for, pass and fail conditions, and how results get reported) ships inside the Mobile Responsiveness Audit. The pattern definition, severity rationale, and remediation remain openly licensed under CC-BY-4.0.
Taxons
History
- 2026-04-18·v1.0.0·Initial import from mobile-responsiveness·automated