Every Layout

Relearn CSS, by example

7 followers

Relearn CSS, by example

7 followers

Visit website

Online learning

•

Design resources

If you find yourself wrestling with CSS layout, it’s likely you’re making decisions for browsers they should be making themselves. Through a series of simple, composable layouts, Every Layout will teach you how to better harness the built-in algorithms that power browsers and CSS.

Launch Team

CloudflareYour next app belongs on Cloudflare Workers. Deploy for free

Promoted

Array

I think this is great and have absolutely no bias whatsoever. [fake moustache falls off]

Report

7yr ago

Product Hunt

@hankchizljaw Ahahah Andy!

Report

7yr ago

Array

@syswarren 😎

Report

7yr ago

@hankchizljaw Lol. Gotta give props for the sense of humour. It looks good though, will definitely give it a go.

Report

7yr ago

Every Layout

Maker

The 2nd edition is now available! See https://twitter.com/layoutpluspl...

Report

5yr ago

Read the demo chapters and found the concepts and semantics you guys teach quite eye-opening. It's a good philosophy. I think personally I'd find it hard to implement as CSS is terrible, but I could definitely see someone learning this and having great gains. I feel like this is can provide the 'aha!' moment for CSS for those looking for it - as in those that currently find it clunky (like me). Great work guys - I like the way you guys write and present information

Report

7yr ago

Planniversary

I keep coming back to this site since it launched on PH. I've just bitten the bullet and bought it. Can't wait to read the whole book/site now

Report

7yr ago

Every Layout

Maker

@ninjapixel Thanks, Matt! Let us know how you get on. A new layout will be added very soon.

Report

7yr ago

React Boilerplate 3.0

Tackles one of the biggest challenges in CSS head-on: how to model layout so that it’s clear, robust, flexible and maintainable. Does a brilliant job of showing how the algorithmic capabilities of flex & grid let us defer work to the browser that previously relied on brittle, imperative approaches. Really impressive stuff.

Report

7yr ago

Your First Year in Code

I love the visual examples & concise wording. I'm all about picking up principles and patterns and this fits in nicely! I'm sure with time , this pattern library is going to grow. This page in particular is absolutely awesome for visual grepping when you don't know the name of what your looking for or your needing inspiration: https://every-layout.dev/layouts/ Suggestions: - The bundle comes with set of custom elements, that's cool but I think more people will get use and time out of the actual content. I'm more likely to go "I know there's a UX pattern" then go grab a code snippet and use that. I can find code snippets online on github easily with search, but it's harder to find nicely condensed resources like this one.

Report

7yr ago

Looks amazing. I would love to have it. I just want to know if there is a discount available. It is ok if not.

Report

7yr ago

1 2

Reviews