📐 Gap vs. Margin: Rethinking Spacing in CSS

Adam Marsden - Apr 24 - - Dev Community

Hey 👋 I hope you're having a great week. Here's a quick look at this week's newsletter:

🚀 Google Core Web Vitals Unpacked

🔍 Why 90% of Designers Don't Make the Cut

🎨 Disney's Animation Secrets Transformed for UX Design

Enjoy this week's edition 👋 - Adam at Unicorn Club.


Sponsored by Webflow

Accelerate your agency’s growth

Whether you need to win new business or wow an existing client, Webflow empowers agencies to deliver high-quality client work, faster — without growing your dev budget.

Start building →


🦄 This week's best

Gap is the new Margin

The margin property of CSS is just a way to push other elements away. It’s very common and doesn’t feel particularly problematic. On the other hand… maybe it is?

Folding the DOM

For years now, browsers have bundled in a surprisingly capable 3D CSS engine! Today I'd like to leverage that 3D engine to perform a neat trick: folding up an image.

Sliding 3D Image Frames In CSS

Creating 3D effects in CSS isn’t an entirely new concept, but typical approaches use additional elements in the markup and pseudo-elements in the styles to pull it off.

Making Disabled Buttons more Accessible

Despite the fact that you may have good reason to disable a button for your users, it’s important to make sure to provide enough context for all users to avoid confusion and good user experience.


🧠 Fun Fact

*Box Model Confusion* - In the early days of CSS, the interpretation of the box model varied between browsers, notably between Internet Explorer and others. This led to inconsistent layouts until the box-sizing property was introduced, allowing developers to standardize the model across browsers for predictable sizing of elements.


How To Monitor And Optimize Google Core Web Vitals

The three Core Web Vitals metrics don’t only tell you how visitors experience your website but also impact your Google search result rankings.

90% of designers are unhirable?

Here’s the harsh truth: I’ve reviewed more than 1,000 portfolios in my design career so far, and I turned 90% of them down because of one thing — the linear design process.

Disney’s 12 principles of animation, exemplified in UX design

Digital products like apps and websites started as counterparts to print media, offering similar content and functionalities, just in a different medium.

🔥 Promoted Links

Share with 2,000+ readers, book a classified ad.

Get smarter about Tech in 5 min

Get the most important tech news, tools and insights. Join 90,000+ early adopters staying ahead of the curve, for free.

Support the newsletter

If you find Unicorn Club useful and want to support our work, here are a few ways to do that:

🚀 Forward to a friend

📨 Recommend friends to subscribe

📢 Sponsor or book a classified ad

☕️ Buy me a coffee

Thanks for reading ❤️

@AdamMarsdenUK from Unicorn Club

. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .