--- title: Best CSS-Tricks posts — August 2021 | daily.dev description: The most upvoted CSS-Tricks posts from August 2021, curated by the daily.dev community. canonical: https://daily.dev/sources/css_tricks/best-of/2021/08 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/sources/css_tricks/best-of/2021/08 og:type: website og:site_name: daily.dev og:title: Best CSS-Tricks posts — August 2021 | daily.dev og:description: The most upvoted CSS-Tricks posts from August 2021, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of CSS-Tricks — August 2021 1. 1 [](https://daily.dev/posts/you-want-enabling-css-selectors-not-disabling-ones-5ydaz-l2o "You want enabling CSS selectors, not disabling ones") Article CSS-Tricks · 5y You want enabling CSS selectors, not disabling ones An enabling selector is what I call a selector that does a job without disabling the particular rule. Let's say we have list items and we want to add the margin to every one except the last one. First, we add margin-bottom to all elements. Then, we disable the bottom margin on the last element. 93 5 2. 2 [](https://daily.dev/posts/napkin-backend-in-the-browser-q0a5coeza "Napkin – Backend in the Browser") Article CSS-Tricks · 5y Napkin – Backend in the Browser Build production-ready API endpoints. No infra. No boilerplate. Just code. Runnable Run and view your code response immediately. Test, lint, and view code errors right in the browser. Your code is automatically saved and backed up in the cloud. 47 3 3. 3 [](https://daily.dev/posts/we-had-90-unused-css-because-everybody-was-afraid-to-touch-the-old-stuff--ty-jituya "“We had 90% unused CSS because everybody was afraid to touch the old stuff”") Article CSS-Tricks · 5y “We had 90% unused CSS because everybody was afraid to touch the old stuff” At PayPal, 90% of CSS was unused because people were afraid to touch it. That’s one of the reasons I sometimes like component-based-styling solutions. Because nobody is afraid of the styles anymore — they are tightly coupled to what they are styling. I’m excited that “scoped styles” are making a bit of a comeback in standards discussions. 33 4. 4 [](https://daily.dev/posts/building-a-cool-front-end-thing-generator-5egh-tu3g "Building a Cool Front End Thing Generator") Article CSS-Tricks · 5y Building a Cool Front End Thing Generator Animated CSS Gradient Generator is a tool for creating animated background gradients in pure CSS. This article is a basic Create Next App project. We are going to create a React component to describe an animated gradient. We want to provide these settings as data throughout our little app using a higher-order component, context/SettingsContext. 26 5. 5 [](https://daily.dev/posts/stay-alert-s8424z1q2 "Stay alert") Article CSS-Tricks · 5y Stay alert Chrome broke the web by disabling alert() and confirm() from cross-origin iframes. Users of CodePen, the widely-used code-sharing site, discovered that they were unable to use these functions in their projects. In the ensuing chaos the change was rolled back until 2022\. It's a story about unloved APIs, and who owns the future of the web. 18 6. 6 [](https://daily.dev/posts/native-javascript-routing--lk7myyazy "Native JavaScript Routing?") Article CSS-Tricks · 5y Native JavaScript Routing? Routing is a key piece of every web application. At its heart, routing involves taking a URL, applying some pattern matching or other app-specific logic to it, and then, usually, displaying web content based on the result. We can update the URL in JavaScript. We’ve got the APIs pushState and replaceState. That’s literally what “Single Page App” (SPA) means. 15 1 7. 7 [](https://daily.dev/posts/disambiguating-tailwind--pa3yqvjt8 ""Disambiguating Tailwind"") Article CSS-Tricks · 5y "Disambiguating Tailwind" The way you use some particular technologies can be super different from how someone else does, to the point they share little resemblance. I appreciated this bit of nuance from a post on Viget’s blog. There could be a whole article written about the many flavours of Tailwind, but broadly speaking those flavours are: 1\. Stock tailwind, ie. no changes to the configuration, 2\. Tailwind that heavily relies on @apply in CSS files but still follows BEM or some other component organization, 3\. tailwind UI, and 4\. heavily customizing Tailwind. 13 2 [See all CSS-Tricks archives](/sources/css%5Ftricks/best-of) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/sources/css_tricks/best-of/2021/08#page","url":"https://daily.dev/sources/css_tricks/best-of/2021/08","name":"Best CSS-Tricks Posts — August 2021","description":"The most upvoted CSS-Tricks posts from August 2021, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/sources/css_tricks/best-of/2021/08#items","numberOfItems":7,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/you-want-enabling-css-selectors-not-disabling-ones-5ydaz-l2o","name":"You want enabling CSS selectors, not disabling ones"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/napkin-backend-in-the-browser-q0a5coeza","name":"Napkin – Backend in the Browser"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/we-had-90-unused-css-because-everybody-was-afraid-to-touch-the-old-stuff--ty-jituya","name":"“We had 90% unused CSS because everybody was afraid to touch the old stuff”"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/building-a-cool-front-end-thing-generator-5egh-tu3g","name":"Building a Cool Front End Thing Generator"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/stay-alert-s8424z1q2","name":"Stay alert"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/native-javascript-routing--lk7myyazy","name":"Native JavaScript Routing?"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/disambiguating-tailwind--pa3yqvjt8","name":"\"Disambiguating Tailwind\""}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Sources","item":"https://daily.dev/sources"},{"@type":"ListItem","position":3,"name":"CSS-Tricks","item":"https://daily.dev/sources/css_tricks"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/sources/css_tricks/best-of"},{"@type":"ListItem","position":5,"name":"August 2021"}]}]} ```