Responsive Grid and Flexbox Page Layout Tutorial (Part 2 of 2: CSS)

Pubblicato il: 28 settembre 2021
sul canale di: Coding in Public

1,488

Laying out a page with grid and flex box can be confusing. In this two part series, I'll show you how to layout a page using a combination of grid and flex box. We’ll create a fully-responsive design that adjusts with modern CSS depending on the user’s screen size.

In this second video, we’ll cover the CSS.

🔗 Key Links 🔗
Github: https://github.com/coding-in-public/b...
Live Code: https://codinginpublic.dev/projects/b...

---------------------------------------

📹 Related/Mentioned Videos 📹
Part 1 (HTML):    • Responsive Grid and Flexbox Page Layo...
Dynamic font sizing video:    • Dynamic Font Size CSS with clamp()
Grid layout examples video:    • Four CSS Grid Layout Examples

---------------------------------------

🔗 Other Links 🔗
Dynamic Font Sizing article: https://css-tricks.com/linearly-scale...
Google Font: https://fonts.google.com/specimen/Inter

---------------------------------------

⏲️ Timestamps ⏲️
0:00 Introduction
3:07 Fixing some HTML errors
4:47 Colors and light/dark mode
9:17 Setting up CSS variables and core styling
15:20 Laying out the page structure
20:45 Finishing the mobile styling
36:27 Media queries
46:15 Conclusion

---------------------------------------

🌐 Connect With Me:
Website: https://www.codinginpublic.dev
Blog: https://www.chrispennington.blog
Twitter:   / cpenned

In questa pagina del sito puoi guardare il video online Responsive Grid and Flexbox Page Layout Tutorial (Part 2 of 2: CSS) della durata di ore minuti seconda in buona qualità , che l'utente ha caricato Coding in Public 28 settembre 2021, condividi il link con amici e conoscenti, su youtube questo video è già stato visto 1,488 volte e gli è piaciuto 53 spettatori. Buona visione!

128