Our Headless CMS architecture uses CSS rather than any framework-dependant flavour or variant (Tailwind/ CSS-in-JS etc).

Responsive Design

When responsive design first became popular, CSS Media Queries were the only tool we had and it became popular to code to certain breakpoints: desktop, tablet (generally 'latest iPad') and mobile. However, different viewport sizes proliferate.

Andy Bell ran a 48 hour test and found over 120,000 datapoints with over 2,300 unique viewport sizes, concluding that the ideal viewport doesn't exist and therefore that a catch-all set of breakpoints can't exist.

Luckily, new CSS layout methods are universally supported by evergreen browsers, the most useful of which is CSS Grid, so now we can (largely) dispense with hardcoded 'magic numbers' and allow Grid to fluidly resize according to the content.

Some useful links:

Books/ paid for thingies

(But Derek will pay for them because he's a gent).