Grid Lanes – The Future of Masonry Layout
This long-debated solution for masonry layout is now available and it’s time to figure out how to use it. Join us for a deep dive into the workings of Grid Lanes.
Winging It
post type
Surprising Effects of CSS Shorthands
CSS properties come in two excellent flavors – longhand properties have a direct impact on the element, while shorthand properties take a much more convoluted path. There’s a lot going on when we use a shorthand property, with hidden surprises, and reasons we might use one or the other.
Check out our CSS Tips & Tricks Playlist to learn more CSS.
What We Cover:
Copy permalink to “What We Cover:”- Shorthands are not properties of elements
- They expand in place to describe actual properties
- Always expanding to describe all sub-properties
- Sometimes even reset properties that can’t be set directly in the shorthand
- Give us a clean start
- This happens before the cascade
- Will conflict with the longhands
- Useful to combine them (put the shorthand first)
- Otherwise: shorthand is designed for starting over
Links:
Copy permalink to “Links:”- CodePen: When to go long(hand)
- CodePen: Combining short & longhand
- CodePen: Long or shorthand?
- Maybe don’t use custom properties in shorthand properties by Manuel Matuzovic
- Sign up for Poetic CSS course updates
Recent Episodes
Winging It post typeDos & Don’ts of Anchor Positioning
CSS anchor positioning isn’t baseline yet, and there’s good reason for that. You can use it, but it comes with some caveats. James, Stacy, and Miriam cover new resources to make anchor positioning easier, and work through some demos to help you understand how anchor positioning works. We also look…
Winging It post typeQuick & Easy UI Wins (for real)
Hidden gems of UI development
Join Stacy, James, and Miriam as we explore some hidden gems of UI development – from
@starting-stylefor smoother entry transitions to performance boosts with AVIF images and using the browser’s built-in lazy-loading. We cover a variety of quick wins that you can use to make your life easier and…
