Discover and read the best of Twitter Threads about #cssgrid
Most recents (5)
If you are learning #CSS then this thread for you.
It might be hard in the beginning to get a good grasp of #flexbox, grid or even CSS selectors.
Here are some games that will make learning CSS fun and easy: 🧵
It might be hard in the beginning to get a good grasp of #flexbox, grid or even CSS selectors.
Here are some games that will make learning CSS fun and easy: 🧵
👾 CSS DInner
In this #CSS game you learn #CSSselectors by picking the food from the table.
Go to flukeout.github.io the game is free.
In this #CSS game you learn #CSSselectors by picking the food from the table.
Go to flukeout.github.io the game is free.
👾 Flexbox Froggy
Here you learn how to work with #flexbox. You use flexbox rules to put a froggy on a lillypad.
Go to codepip.com/games/flexbox-… the game is free, but requires you to register. There is also a pro version with more advanced levels
Here you learn how to work with #flexbox. You use flexbox rules to put a froggy on a lillypad.
Go to codepip.com/games/flexbox-… the game is free, but requires you to register. There is also a pro version with more advanced levels
Learn CSS Grid for #FREE thread 🧵
Want to learn CSS Grid for free but not sure where to start?
I've compiled a list of free resources that covers:
🧬References
📖Complete Guides
📝Tutorials & Examples
🛠️Tools
⬇️⬇️⬇️
#100DaysOfCode #CodeNewbie #CSS #CSSgrid
Want to learn CSS Grid for free but not sure where to start?
I've compiled a list of free resources that covers:
🧬References
📖Complete Guides
📝Tutorials & Examples
🛠️Tools
⬇️⬇️⬇️
#100DaysOfCode #CodeNewbie #CSS #CSSgrid
References
W3C - w3.org/TR/css-grid-1/
MDN CSS Grid - developer.mozilla.org/en-US/docs/Web…
CanIUse - caniuse.com/#feat=css-grid
W3C - w3.org/TR/css-grid-1/
MDN CSS Grid - developer.mozilla.org/en-US/docs/Web…
CanIUse - caniuse.com/#feat=css-grid
Complete Guides [1/2]
@css Complete guide to Grid - css-tricks.com/snippets/css/c…
@codrops CSS Grid reference -tympanus.net/codrops/css_re…
Learn CSS Grid by @jonsuh - learncssgrid.com
CSSGarden - cssgridgarden.com
@css Complete guide to Grid - css-tricks.com/snippets/css/c…
@codrops CSS Grid reference -tympanus.net/codrops/css_re…
Learn CSS Grid by @jonsuh - learncssgrid.com
CSSGarden - cssgridgarden.com
Empezó como una necesidad de tener un framework de maquetado hecho a mi medida, y se terminó convirtiendo en todo un proyecto, así que decidí subirlo a GitHub. Grill apunta ser un framework puramente CSS y mobile first, basado en #CSSGrid.
github.com/Adrian-Benaven…
github.com/Adrian-Benaven…
Es algo que empecé hace apenas una semana así que está suuuuper pelado de features, la idea es ir mejorandolo con el tiempo. Prometo escribir una documentación en cuanto me libere de la facu. Mientras tanto, tienen un demo (archivo index.html), para ir chusmeando
Le puse licencia GNU 3.0 😉
Les dejo un ejemplito de cómo pueden crearse un set de media queries expresivas con #Sass en solo unas líneas de código.
Emmm, el `flex-direction: row` no era necesario ya que es el valor por defecto, se me escapó 😅
Con el mismo array de breakpoints y el mixin del ejemplo anterior, rápidamente podríamos crear una grilla responsive con #CSSGrid haciendo algo como esto...
Experimentando por primera vez con CSS Grid, recreando el Buscaminas, viejo juego de Windows codepen.io/alejuss/full/v… … #cssgrid #minesweeper
La captura de copeden no motiva nada entrar, pero prometo que se ve bien jajaj
Y desde ya que necesito críticas, sugerencias, hachazos! todo viene bien. 👌🏼
