Modern CSS Layouts: You Might Not Need A Framework For That — Smashing Magazine

Most people have probably come across Maslow’s hierarchy of needs, and the analogy “to a man with a hammer, everything is a nail”. But fewer know that this analog is attributed to Maslow–Maslow’s Hammer.

A day or two ago we linked to Old Dogs, new CSS Tricks by Max Böck, which considered why it is that despite having all these powerful new CSS tools, they are under used.

Allow me a little self indulgent reflection. Back in the mid to late 1990s as the web began to get a solid hold on the popular imagination yet the technologies for web design were very primitive, techniques emerged to make designs more print-like.

One involve using tables to layout pages, and images for text, particularly headings (this is pre CSS, certainly pre wide spread implementation of CSS).

Now this is when network speeds were in the order of kilobits a second, not tens of hundreds of megabits–so thousands or tens of thousands of times slower. A 20KB image might take several seconds or longer to download. And you thought flash of unsettled content was an issue?
Tables were tricky to mark-up, and even harder to rework. Errors were common. And you might imagine how accessible or otherwise these pages were.

But these techniques took root, and took years to undo. Because a generous of web designers got really good at slinging the table based hammer.

Now we might scoff at these rubes from ancient times but it’s very likely you do something very similar. How long did it take you to adopt flex or grid? Did you cling fast to your tried and true float based layouts?

What relatively recent JavaScript language features have you adopted lately?

Now this is not to argue we should always be embracing whatever the new hotness is for its own sake, but nor should we keep wielding our hammer, when other better tools are available.

In this piece, Brecht De Ruyte looks at newer CSS features related to layouts.