Fluid Grids and Inline Conditionals

2024-06-17


Hey friends,

Why are peppers the best at archery?

Because they habanero!

πŸ˜‚πŸ˜…


Words I Wrote

You know what goes well with Fluid Type? Fluid Grids!

But not just any grid. This is a SPECIAL grid because it allows for 'breakout' elements. It's based on a technique from Ryan Mulligan that's based a technique from Josh Comeau (as one does on the web... 🧐)

Gone are the negative margins (thanks CSS Grid), gone are the ratcheting container widths with media queries. This is fluid all the way up and downβ€”one definition for desktop and mobile viewports!

Check it out: Fluid Breakout Layout with CSS Grid.


Interesting Web Bits


Don't miss what's next. Subscribe to Net Noodlings with Nathan: