Good tips on grid declarations! Similar to flex reverse, grid-template-area is powerful, especially when you need to re-order your grids on multiple breakpoints.
Note that the element order in html doesn't change, so screen readers and focus will follow DOM flow.
Software Architect and Security Officer with 20 years of experience, Web Dev has shifted from my main profession to a hobby as I rarely get to code by now and just love the craft. Check out my channel
Thanks for positive feedback and for pointing out the focus order, I wasn't aware of that. 😅 A potentially confusing focus order is actually something that would limit using grid areas to reorder elements for me in some situations.
For further actions, you may consider blocking this person and/or reporting abuse
We're a place where coders share, stay up-to-date and grow their careers.
Good tips on grid declarations! Similar to flex reverse, grid-template-area is powerful, especially when you need to re-order your grids on multiple breakpoints.
Note that the element order in html doesn't change, so screen readers and focus will follow DOM flow.
Thanks for positive feedback and for pointing out the focus order, I wasn't aware of that. 😅 A potentially confusing focus order is actually something that would limit using grid areas to reorder elements for me in some situations.