It was an honor talking about Defensive CSS @ParisWeb. You can watch the talk here (It's a part of a live stream): youtube.com/watch?v=ym2sI8Jl…

🌟 New Tip When working with multilingual websites, make sure to account for short content lengths by setting a minimum size. In this example, the button "Done" become too small in Arabic. We can fix that by setting a min-width in CSS. Read more: defensivecss.dev/tip/button-…

💡 In CSS grid, we can choose between auto-fill and auto-fit for how a grid item should behave. The keyword auto-fit is risky, specially when we don't know the number of grid items. Read more in this defensive CSS tip: defensivecss.dev/tip/auto-fi…

It's a common mistake to use display: flex and forget about it. When the content gets longer, flex items will stretch to fill the parent. That's what happened to the image here. The fix is to use align-items or align-self depending on the use case. 🔗 defensivecss.dev/tip/default…

Have you ever tried using position: sticky with CSS grid and it didn't work? You need to override the default behavior of CSS grid by applying align-self: start to the aside. ✍️ Find out more in this defensive tip: defensivecss.dev/tip/positio…

You might have missed this part 😄

Current status: working on the introductory article for Defensive CSS ✍️ I'm really excited to publish the project soon 🤩

I'm having so much fun creating these abstract covers for each CSS defensive tip! 🤩

Current status: building interactive demos showing some defensive CSS techniques in action 🤩