Search

A follow-up to Andy's previous explanation of his compound grid layout in which they explain their logic behind a 4 + 5 compound grid a bit more. It's neat, but this description is what really caught …

When Eric first tweeted about the new design on his site, I thought something a bit unusual was going on with the CSS layout. I actually dove straight into the source that day and learnt a little …

A super useful recap of the main ways that CSS calculates percentage for element layout, each with a brilliant slider-based demo. The …

I love Andy's new design over on Stuff & Nonsense. A large part of that are the cleverly diverse page layouts. Turns out, underneath that perceived diversity is a consistent grid, made …

An intriguing new project from some of the brains at ClearLeft for "elegantly scaling type" on the web. Personally, I'm all for anything that reduces or removes the need for breakpoints in my …

A really like Eric's latest redesign. I'm a huge fan of ink drawings in general, so it figures I'd like this, but more than the graphic elements I feel like the layout manages to strike a great …

The Markup have recently been doing a great job of analysing some of the big names in the tech world and highlighting some less-than-stellar behaviour or situations. However, what's really caught my …

A simple and informative example of how the new CSS clamp property can be used to create fluid layouts (in this case, specifically a fluid type …

Max has put together one of the best examples of how container queries will fundamentally change the way front-end development works. Better still, they provide extremely clear explanations of …

Heydon's video is an excellent overview of their much-loved owl selector and "stack" layout pattern. I actually didn't realise that Heydon was the original "inventor" of the owl, though it makes a …

Ahmad has put together some really interesting examples of where modern CSS techniques can replace traditional use-case for absolute positioning. I'd be really interested to know how some of them …

I have a vague memory of CSS Regions being talked about, but had completely forgotten them. It turns out that's likely because the spec has effectively been pulled. I think it's technically still out …

I am an …

Reddit has once again directed me towards a very interesting online resource: Interneting is …

There are a lot of new web technologies emerging at the moment which really feel like we're entering a new era. Over the last decade, the likes of HTML5, ES6+, flexbox etc. have brought the web, and …

I've had my current Sony Xperia for nearly three years, which is a good run, but it's definitely starting to show its age. First of all the headphone jack broke; it still works, it just doesn't know …

An attempted experiment to replicate the blog layout of ilovetypography.com, which uses floats to great effect, with more modern CSS Grid and Flex techniques. Turned out to not be quite so simple, but taught me a lot about the benefits and limitations of CSS Grid.

Migrating assets to a new CMS can be a complete pain, but working out which files go with each page or article on a website doesn't have to be a nightmare if you start with a solid foundation. For me, that means tightly coupling my folder structure on the server with my content structure on the website, a workflow that Craft is particularly nifty at automating.

Welcome to the third version of theAdhocracy! It's been a long time coming, but the site has finally been rebuilt, rehosted, and re-just-about-everything else, so I figured I'd actually formalise the launch with a new post explaining what's happened and why.

A look back and a look forward... it must be the start of a new year. 2019 held a lot of change and personal improvement, but I can't help but feel that 2020 is going to be a big one. So what exactly do I have planned and what am I hoping for the next 12 months?

I keep running into the same problem: how to set a style attribute in the CMS and have that be dynamically rendered on the front-end, without relying on inline styles. Turns out it's a great use case for CSS variables!

A great explanation of why two-pass rendering is a useful mental model to consider when working with server-side rendering/SSGs like Gatsby and JavaScript frameworks. The main point? …

I finally made it to an IndieWebCamp meetup, even if it was remote only due to the increasingly restrictive implications of the coronavirus. I learnt a lot, I had a great time, and I'm ready to start implementing a whole bunch of new ideas right here. I also took a huge number of notes from the speakers and sessions throughout the day.

In which I start off asking a simple question: what content categories should I use on this website? Four hours later, I've discoverd information gardening, now pages, digital-me libraries, and oh so much more. And yes, I think I've answered that first question. Fancy a trip down the rabbit hole?

The search page is live, the index is populated, but it all looked a bit rubbish and it didn't quite work as well as I wanted. Now it's using custom-styled components, queries are tracked/stored via the URL for persistence, and you can filter results based on category.

An interesting read that covers some of the basic terminologies of typesetting, as well as the technicalities of how browsers actually interpret the line-height value. Hint: it's not what you'd …

A pretty exhaustive overview of the HTML and CSS options that we now have for responsive image layouts. Here are some key …

Notes from the 2020 Jamstack Conf. Some interesting dives in the Jamstack community and various applications of Jamstack technologies, with tweet threads as usual.

Rather than set a max-width on his main content grid, Ethan has used what he calls a constraint column. Basically, the right-most column on his grid scales with the viewport and restricts …

I think there's some real merit to Andy's ideas behind Cube CSS. It's a middle-ground between everything-in-JS or BEM that throw out the cascade entirely and the free-for-all that can happen if you …