Designing a focus style
Analyzes the pros and cons of browser default focus styles and explores custom design alternatives for better accessibility and branding.
Analyzes the pros and cons of browser default focus styles and explores custom design alternatives for better accessibility and branding.
A detailed guide to a modern, lightweight CSS reset that explains the reasoning behind each rule and its benefits for web development.
A CSS tutorial on creating more realistic and nuanced shadows using layered box-shadows for finer control over sharpness and spread.
A reflection on web development fundamentals, arguing for prioritizing accessibility, HTML, and CSS over JavaScript frameworks to build a web for everyone.
A tutorial explaining the CSS Flexbox layout model, covering core properties like flex-direction and flex-wrap for creating responsive designs.
A tutorial on creating layouts using core CSS concepts like floats, positioning, and the box model, emphasizing understanding fundamentals before using libraries.
Argues that front-end developers must learn foundational HTML and CSS before JavaScript to build robust, maintainable applications.
A short blog post discussing a technical web design issue: making footers stick on pages with minimal content.
Argues against CSS-in-JS for most projects, advocating for traditional stylesheets and methodologies like BEM for better maintainability.
A developer details the CSS techniques used to create an animated rice ball dessert for a CodePen challenge, focusing on clip-paths, animations, and textures.
An article exploring the unique mindset required to write effective CSS, focusing on its declarative nature and core concepts.
A technical guide to implementing an animated progress bar in stages, covering CSS animations, JavaScript triggers, and handling multiple queued instances.
A developer lists 8 common web accessibility mistakes, like removing focus outlines and misusing placeholders, and provides practical solutions to fix them.
A developer discusses the importance of constructive advocacy in tech communities, focusing on respectful communication over shaming.
A developer details the creative process of building a light switch toggle UI component using mostly CSS, gradients, and shadows.
A guide on integrating Sass (Syntactically Awesome Style Sheets) into a Blazor application to improve CSS management with variables and mixins.
A tutorial on how to force line breaks and control row wrapping in CSS Flexbox layouts using a specific collapsed element technique.
Explores a new CSS method using opacity and pointer-events to hide content visually while keeping it accessible to screen readers and keyboard users.
A CSS-only technique to create a masonry layout using flexbox, the :nth-child() selector, and the order property, avoiding JavaScript.
A tutorial showcasing 10 practical CSS Flexbox layout patterns with ready-to-use example code for common web design scenarios.