Project Homepage: http://jaspreetkaur.com/practicalcsslayouts/
The best way to learn something new is to practice. When I started learning CSS Grid, I found that most of the articles/tutorials provide a very basic layout to make it easy to explain things. But those easy layouts do not cover real word challenges that we face while working on actual projects. So I decided to design some real pages to find out the real challenges while working with new CSS layout modules.
I am creating these pages using CSS Grid layout Module, Flexible Box Layout Module (Flexbox), and other new features in CSS. Also, I have shared my code in this github repository so that anybody can use the code for learning.
Layout 2 - Page 1
Can I use these designs?
I have used some open source designs available at different websites; due credit is given to each designer. Please get in touch with the respective designers if you need more details about licensing information for a design.
Can I use this code?
This is an open source project, you can use the code as you like. However because code in this project is experimental, I cannot guarantee its compatibility with all browsers and devices.
Can I contribute?
Yes, any contributions are welcome, if they are relevant to this project.
Can I provide you a design for coding?
Yes, but all pages/designs will be available as part of this open source project. Alternatively I am available on upwork for paid projects.
How can I learn CSS Grid Module?
I am curating a list of learning resources (Link to be added)
Hi, I am Jaspreet K. Jain, I am a Frontend developer, entrepreneur, co-founder @ HSR Technologies, and mother of a lovely son.
Follow me on twitter @jaspreetkjain
Share my love for this project so that others can know and then use this code.