Discover more from The Art && Science of Ruby
Part 1: CSS
Firstly, while I try to write something every week, I just missed a couple. Sorry about that - I actually took a holiday (my wife and I went to Krakow in Poland, which was such a nice place). Holidays were hard to come by when I was purely freelancing so I took full advantage. But I'm back now so I'm going to try and stick to the schedule.
In the last few weeks my mind has been blown twice. I'm an old gimmer and I've been programming a long time. I'm also pretty conservative when it comes to technology - the wave of hype that accompanies every new framework or technique doesn't impress me (although there are possibly reasons for that which I might talk about another day).
I bought a book called Every Layout describing how to use CSS for layouts (as opposed to "decoration"). And my mind was totally blown. For the last ten years I've been using various flavours of 12 column grids with responsive breakpoints which work OK but always have certain sizes that just look crappy. My CSS has never been great so I just shrugged and accepted it.
But Every Layout describes how to truly do responsive layouts. It defines a series of primitive layouts (using components if you prefer) and they respond, not just to the available size but also to the content within them. The "switcher" changes from being a series of elements laid out horizontally to being placed vertically, not only when the width of the parent element is reduced but also when you add too many child elements to fit comfortably across your horizontal space. The "cover" gives you true vertical centering without going over the parent borders or chopping off the internal content.
And because they're primitives, you combine them - your header might be two nested clusters to give you a logo and menu bar. Your main section might be a sidebar with a nested stack on each side. A form is a box containing a stack containing a smaller stack with labels and inputs, followed by a cluster of buttons.
So if you have about £50 to spare, I thoroughly recommend Every Layout. It's one of those things where, now I know, I look at everything I've written before and can't believe how ugly the code is and how badly it works.