scroll-areas

To prevent nested scrolling and uncontrolled overflow, prefer page-level scrolling, pagination, or collapsible sections. Apply single-axis scrolling only to justified fixed-height containers like sidebars to keep navigation predictable and user-controlled.

Data tables, chat panels, and code editors need inner scroll areas when they are fixed-height or constrained components. Apply a single scroll axis to these justified containers while preserving native user-controlled scrolling behavior and avoiding scroll hijacking.

The best way to improve scroll affordance is using partial content visibility and subtle visible scrollbars. This ensures users can easily recognize scrollable regions within constrained panels without relying on confusing nested scroll areas.

Handle auto-scroll behavior in log views by avoiding forced auto-scrolling and scroll hijacking. Instead, support appropriate scroll restoration, anchor navigation, and conditional updates to preserve user control over the scrolling experience.

Page-level scrolling works for touch devices by default, while fixed-height sidebars require accessible single-axis inner scrolling. Ensure native user-controlled behavior and visible scroll affordances are maintained across all constrained components.