Button vs Div: What's the Big Deal Anyway?
summary
Live demo converts a native button into a div and back, showing exactly what is missing: browsers assume the first button is a submit so role="button" + tabindex + key handlers are often needed to make a div activate with Enter/Space, and dozens of CSS tweaks replicate button defaults — box-sizing includes padding; default button padding is seven pixels; borders use outset styling; some iOS builds need a pointer hint. Conclusion: platform elements require far less code than recreating them; wai-aria provides patterns for complex widgets.
AI-written summary · about
chapters (4)
- 0:00Start
- 1:59Convert Your Div into a Button
- 4:23Box Sizing
- 8:45What Are the Reasons Why Someone like the React Native Web Team Would Want To Use a Div as a Button the
related talks
31mI Can't Believe It's Not JavaScript!
27mMaking Interactions Accessible to All Users
51mWhy Good Markup Matters for All Users
47mThe Links vs. Buttons Showdown
41mAccessibility of Web Components
24mI Can't Believe It's Not JS
36mStop using JS for that: moving features from JS to CSS & HTML
11mInclusive clicks in JS apps