Expand/Collapse Examples

Example 1: Semantic HTML (Preferred)

Using the native <details> and <summary> elements. This requires no JavaScript for basic functionality and is accessible by default.

Review Shipping Information

Standard shipping is free for orders over $50. Expedited shipping options are available at checkout.

Estimated delivery: 3-5 business days.

Example 2: ARIA Disclosure Pattern

Using a <button> and a container <div> linked via aria-expanded and aria-controls. This is useful when you need precise animation control or custom behaviors not supported by native elements.