Search icon CANCEL
Arrow left icon
Explore Products
Best Sellers
New Releases
Books
Videos
Audiobooks
Learning Hub
Conferences
Free Learning
Arrow right icon
Arrow up icon
GO TO TOP
Mastering CSS Grid

You're reading from   Mastering CSS Grid A comprehensive and practical guide to creating beautiful layouts with CSS Grid

Arrow left icon
Product type Paperback
Published in Jun 2023
Publisher Packt
ISBN-13 9781804614846
Length 330 pages
Edition 1st Edition
Languages
Tools
Arrow right icon
Author (1):
Arrow left icon
Pascal Thormeier Pascal Thormeier
Author Profile Icon Pascal Thormeier
Pascal Thormeier
Arrow right icon
View More author details
Toc

Table of Contents (16) Chapters Close

Preface 1. Part 1–Working with CSS Grid
2. Chapter 1: Understanding the Basic Rules and Structures for CSS Grid FREE CHAPTER 3. Chapter 2: Project Introduction: What We’ll Work on and First Tasks 4. Chapter 3: Building Advanced Grid Layouts 5. Part 2 – Understanding the CSS Grid Periphery
6. Chapter 4: Understanding and Creating Responsive and Fluid Grid Layouts 7. Chapter 5: Implementing Layouts with Flexbox and CSS Grid 8. Chapter 6: Benefits of Grid Layouts and When Not to Use Them 9. Part 3 – Exploring the Wider Ecosystem
10. Chapter 7: Polyfilling CSS Grid’s Missing Features 11. Chapter 8: Grids in the Wild – How Frameworks Implement Grids 12. Part 4 – A Quick Reference
13. Chapter 9: Quick Reference and Cheat Sheet 14. Index 15. Other Books You May Enjoy

Summary

In this chapter, we’ve learned about the project we’ll be working on throughout the book: Awesome Analytics. Although its data is gibberish, Awesome Analytics is a realistic example we can use to practice our CSS Grid skills and shows us how to create complex user interfaces with CSS Grid.

We’ve practiced the basic rules of CSS Grid with our first task of implementing the page layout and a self-arranging grid for the chart boxes and have satisfied all the stakeholders. Our result looks just like the mockups. To achieve this result, we’ve used grid areas, sizing keywords, and the repeat function, and we’ve altered grid flow and added rows automatically. In the following chapters, we’ll further build upon this knowledge and create even more complex user interfaces.

Since we know the repository, we know how to navigate through the code base and which tools we’ll use in the next chapter.

The next chapter will show you how...

lock icon The rest of the chapter is locked
Register for a free Packt account to unlock a world of extra content!
A free Packt account unlocks extra newsletters, articles, discounted offers, and much more. Start advancing your knowledge today.
Unlock this book and the full library FREE for 7 days
Get unlimited access to 7000+ expert-authored eBooks and videos courses covering every tech area you can think of
Renews at AU $24.99/month. Cancel anytime