Expand / Collapse Widget

Interactive examples demonstrating an accessible expand/collapse pattern. Each widget is wrapped with a .example element and the controlled content container has the class .details.

Basic Details

Simple expand/collapse

Multiple Items

Contains a list of items

Initially Open

Starts expanded and contains nested toggle

This example begins open. Inside it is another small disclosure to show nested cases.