15 CSS Tricks That Save Me Hours Every Week CSS has evolved. These aren't hacks — they're modern features you should be using. 1. Container Queries (Finally!) /* Before: Media queries based on viewport */ .card { max-width : 400px ; } @media ( min-width : 768px ) { .card { max-width : 200px ; } } /* After: Based on parent container! */ .card-container { container-type : inline-size ; } @container ( min-width : 300px ) { .card { display : grid ; grid-template-columns : 1 fr 2 fr ; } } @container ( max-width : 299px ) { .card { display : block ; } } Enter fullscreen mode Exit fullscreen mode Why it matters: Components that adapt to their container, not the whole page. 2.…