(Don’t) Mind the Gap
Explores the use of the CSS `gap` property in Flexbox layouts, highlighting its benefits over margins for spacing in responsive designs like breadcrumbs.
Michelle Barker is a front-end developer and writer behind CSS { In Real Life }, a blog dedicated to modern CSS and real-world web development. She shares honest, practical insights on evolving CSS features, front-end techniques, and the web community.
227 articles from this blog
Explores the use of the CSS `gap` property in Flexbox layouts, highlighting its benefits over margins for spacing in responsive designs like breadcrumbs.
A web developer reflects on choosing her blog's domain name and TLD, inspired by a newsletter about owning your web presence.
A developer compares coding in volunteer, agency, and product roles, using gardening as a metaphor for managing legacy code and continuous improvement.
A developer explores creative uses of CSS gradients, sharing techniques for layered effects, custom properties, and even pixel art generation.
A developer commits to daily blogging for #NaBloPoMo, sharing inspiration from CSS artists and web dev resources.
A web developer reflects on finding purpose in tech work, balancing personal values with industry impact, and seeking meaningful connections.
A tutorial on using CSS attribute selectors to automatically style external links with icons, improving user experience.
Analysis of the COP28 website's poor web sustainability and performance, highlighting greenwashing through excessive page weight and unoptimized assets.
The Sustainable Web Design Community Group releases draft guidelines for building environmentally sustainable web applications.
Explores reactivity patterns in vanilla JavaScript, comparing them to frameworks like Vue and discussing when to use each approach.
A developer shares a curated list of essential tools and libraries for modern web development, including bundlers, performance testers, and VS Code extensions.
Explores the CSS linear() function for creating custom, non-linear easing effects in animations, moving beyond basic timing.
A developer's talk on making web development more sustainable, covering facts, figures, and actionable steps to reduce environmental impact.
A video talk from a conference covering modern CSS layout techniques and new features for web development.
A reflection on CSS Day 2023, highlighting the rapid evolution of CSS, the undervaluation of CSS skills, and the need for community building.
A discussion on managing complexity in front-end development, advocating for fewer dependencies and leveraging the web platform.
Introduces Carbon Capture, a new WebPageTest add-on for measuring and analyzing a website's estimated CO2 emissions to promote sustainable web development.
A collection of resources for improving website performance and reducing carbon emissions through efficient coding and caching practices.
A technical exploration of the CSS :has() pseudo-class, demonstrating its power for selecting parent and sibling elements with interactive demos.
A tutorial on creating custom VS Code snippets to automate repetitive coding tasks and speed up development workflow.