CSS

D

PHP Intermediate

Dark Mode End to End: OS Preference, Toggle, and No Flash of White

Respect the system setting, let users override it, remember the choice, and never flash the wrong theme on load - the complete wiring across CSS, JS and PHP.

Jun 6, 2026 3 min 119 Read →

4

PHP Intermediate

400-Byte Image Previews: Blur-Up Placeholders with PHP GD

The gray-box loading experience becomes a soft preview of the real image - generated at upload with GD, inlined as a data URI, crossfaded away on load.

May 30, 2026 3 min 79 Read →

S

CSS Advanced

Subgrid: Card Grids Where Everything Finally Lines Up

Titles, prices and buttons at different heights across cards - the misalignment that made designers invent equal-height hacks - is what subgrid was built to end.

Dec 13, 2025 2 min 862 Read →

F

CSS Beginner

field-sizing: content - Auto-Growing Textareas With Zero JavaScript

Every chat box and comment field ships JS that measures scrollHeight to grow the textarea. One CSS property now does it natively - with a progressive-enhancement story for the rest.

Dec 8, 2025 2 min 907 Read →

L

CSS Intermediate

light-dark(): Two-Mode Colors in One Declaration

Half your dark-mode CSS is pairs of rules flipping the same property. light-dark() collapses each pair into one line - and color-scheme unlocks free dark UI from the browser itself.

Nov 29, 2025 2 min 1,149 Read →

P

CSS Beginner

Print Styles in 2026: Yes, People Still Print Your Invoices

Order confirmations, tickets, recipes, documentation - they get printed and PDF-saved daily. Twenty lines of @media print separates professional from embarrassing.

Nov 23, 2025 2 min 1,409 Read →

Z

CSS Intermediate

z-index: 99999 Isn't Working Because of Stacking Contexts

When a dropdown hides behind a header despite a huge z-index, the number is not the problem - the element is trapped in a stacking context. Here is the mental model and the debugging routine.

Nov 15, 2025 3 min 969 Read →

@

CSS Advanced

@starting-style: Transitions From display: none At Last

Elements appearing via display changes always snapped into place because there was no "before" state to transition from. Two new pieces of CSS fix entry AND exit animations.

Nov 6, 2025 2 min 980 Read →

S

CSS Advanced

Scroll-Driven Animations: Progress Bars and Reveals Without JS

animation-timeline: scroll() binds any CSS animation to scroll position - reading progress bars, parallax, scroll reveals - running off the main thread entirely.

Nov 2, 2025 2 min 264 Read →

:

CSS Beginner

:empty - Hide Containers That Have Nothing to Say

Notification badges showing "0", alert boxes rendering as empty bordered rectangles, list wrappers with padding and no list - :empty cleans up after your templates.

Oct 29, 2025 2 min 1,013 Read →

F

CSS Intermediate

Floating Labels with :placeholder-shown (No JavaScript, No Wrappers)

The material-style label that sits in the field and floats up when you type is a pure CSS pattern - one pseudo-class, one sibling selector, one transition.

Oct 21, 2025 2 min 331 Read →

O

CSS Beginner

overscroll-behavior: Stop the Page Scrolling Behind Your Modal

Scroll to the bottom of a dropdown or chat panel and the page behind starts moving - scroll chaining. One property contains it, no JavaScript scroll-locking required.

Oct 17, 2025 2 min 344 Read →