css-challenges

← overzicht

CSS challenge 11: Container queries en units

πŸ—“οΈ βΈΊ Dinsdag 25 maart
⏰ ⸺ 9:30 - ca 11:30 uur
πŸ™‹ βΈΊ voor: even aanmelden - max 24

Oefening 0: 🌳 Media query recap-je (opwarmen)

πŸ“Š βΈΊ 🟦 πŸŸ₯

πŸ§‘β€πŸ’» βΈΊ Code voor jou (CodePen)
πŸ§‘β€πŸ’» βΈΊ Uitwerking (CodePen)

niet meteen spieken 🫣

Oefening 1: 🌱 My first container query (opwarmen)

πŸ“Š βΈΊ 🟦 πŸŸ₯

πŸ§‘β€πŸ’» βΈΊ Code voor jou (CodePen)
πŸ§‘β€πŸ’» βΈΊ Uitwerking (CodePen)

niet meteen spieken 🫣

Oefening 2: 🍱 Layout met container queries

πŸ“Š βΈΊ πŸŸ₯ ⬛️

πŸ§‘β€πŸ’» βΈΊ Code voor jou (CodePen)
πŸ§‘β€πŸ’» βΈΊ Uitwerking (CodePen)

niet meteen spieken 🫣

Oefening 3: 🐑 Container queries units

πŸ“Š βΈΊ πŸŸ₯ ⬛️

πŸ§‘β€πŸ’» βΈΊ Code voor jou (CodePen)
πŸ§‘β€πŸ’» βΈΊ Uitwerking (CodePen)

niet meteen spieken 🫣

🎯 βΈΊ A Friendly Introduction to Container Queries (Josh Comeau πŸ§‘β€πŸ’»)
🎯 βΈΊ CSS Container Query Units (Ahmad Shadeed πŸ§‘β€πŸ’»)
🎯 βΈΊ Container Query Units and Fluid Typography (Stephanie Eckles πŸ§‘β€πŸ’»)

This site is open source. Improve this page.