{
  "id": "F102",
  "rulePrefix": "F102",
  "variant": null,
  "ruleType": "w3c-failure",
  "scanScope": "specimen",
  "synthetic": false,
  "status": "current",
  "title": "Failure of Success Criterion 1.4.10 due to content disappearing and not being available when content has reflowed",
  "summary": "content disappearing and not being available when content has reflowed",
  "whyItFails": "This page reproduces the F102 failure pattern so auditors can verify detection against 1.4.10.",
  "principles": [
    "perceivable"
  ],
  "guidelines": [
    "1.4"
  ],
  "successCriteria": [
    {
      "id": "1.4.10",
      "name": "Reflow",
      "level": "AA",
      "slug": "reflow"
    }
  ],
  "versions": [
    "2.1",
    "2.2"
  ],
  "automatable": "yes",
  "requires": [
    "html",
    "css"
  ],
  "isolated": true,
  "pairWith": [],
  "w3c": {
    "understanding": [
      "https://www.w3.org/WAI/WCAG22/Understanding/reflow"
    ],
    "quickref": [
      "https://www.w3.org/WAI/WCAG22/quickref/#reflow"
    ],
    "technique": "https://www.w3.org/WAI/WCAG22/Techniques/failures/F102"
  },
  "specimen": {
    "html": "<div class=\"f102-layout\">\n  <aside class=\"f102-sidebar\">Filters and navigation</aside>\n  <main class=\"f102-main\"><p>Main article text reflows here.</p></main>\n</div>",
    "css": ".f102-layout { display: flex; gap: 1rem; }\n.f102-sidebar { min-width: 140px; background: #eee; padding: 8px; }\n@media (max-width: 320px) { .f102-sidebar { display: none; } }",
    "js": "",
    "assets": [],
    "demoHint": "Narrow the viewport below 320px — sidebar content disappears with no alternative access."
  },
  "expectedFindings": [
    {
      "sc": "1.4.10",
      "outcome": "fail",
      "note": "Specimen demonstrates failure of 1.4.10."
    }
  ],
  "mustNotFlag": [],
  "manualCheck": "Confirm the specimen demonstrates the documented F102 failure in isolation.",
  "generated": {
    "url": "https://wcagfail.patternd.io/specimens/F102/",
    "lastmod": "2026-10-08"
  }
}
