Front-End Practice
Use a container query when a component needs to respond to its own space
Container queries let a component adapt to its available inline space. Use a small card example to see how they differ from viewport-based media queries.
SOFTWARE · SECURITY · DESIGN
CSS
Front-End Details
Reserve image space with CSS aspect-ratio before the file finishes loading
Reserve the right image proportions before loading finishes, and avoid a layout jump caused by a placeholder that changes shape.
Frontend Development
Use CSS Logical Properties When a Layout Must Change Reading Direction
CSS logical properties express spacing and size in relation to writing direction, helping multilingual layouts adapt without duplicating every rule.
Accessible Interfaces
Respect Reduced-Motion Preferences Without Removing Useful Feedback
Use prefers-reduced-motion to reduce non-essential animation while keeping progress, state changes and errors understandable to website visitors.
Web Development
A Sticky Sidebar Needs the Right Scrolling Ancestor
Diagnose a sidebar that will not stay in view by checking its inset, scrolling ancestor and available space before adding more CSS.