Review my CSS breakpoints for responsive gaps
Reviews your CSS media queries and layout rules for responsive gaps and lists the screen widths to test by hand.
Task:
Review the CSS below for responsive design gaps and tell me which screen widths I should test by hand.
Context:
The page is [page description]. My target range is from [smallest width] pixels to [largest width] pixels.
Rules:
- Read the whole stylesheet first and list the breakpoints you find.
- Look for ranges between breakpoints where the layout may break, fixed widths that can overflow, text that may not scale, and hover-only interactions.
- Quote the CSS rule for each finding, in at most one line.
- You cannot render the page, so mark every finding as "likely" or "check", and never claim to have seen the layout.
Result:
A list of at most eight findings, each with the quoted rule, the problem and a one-line fix. Then a list of five screen widths to test by hand, with a reason for each.
Material:
[paste your CSS here]