Stefan Judis covered this recently, and like Stefan, I first heard of the safe keyword in CSS from Rachel Andrews at an AEA conference years ago. It’s used in addition to other alignment keywords in layout like this for example: The extra value safe here is essentially saying “don’t let the alignment force a situation […]

Frontend Masters is an online learning platform offering  courses on frontend development technologies such as JavaScript, HTML, CSS, React, and Vue.js. Readers can learn about advanced frontend concepts, best practices, and modern development workflows from industry experts. With video lectures, exercises, and real-world projects, Frontend Masters provides  guidance and expertise for mastering frontend development skills.

Frontend Masters

The 'safe' keyword in CSS is used to prevent content alignment from causing data loss, where content becomes positioned off-screen and inaccessible. It ensures that elements stick to the top and can always be scrolled to.

What is safe alignment in CSS?

<p>hack :)
but its not supported in safari :(</p>


<p>It’s amazing !!! Shame for safari (but it’s coming soon)</p>
