Thierry Koblentz<\/a><\/p>\n<\/blockquote>\nLooking at the newest release of Bootstrap, a whole host of utility classes is now offered, while still including its traditional components. Increasingly, popular frameworks are taking this mixed approach. <\/p>\n","protected":false},"excerpt":{"rendered":"
Even if you consider yourself a CSS expert, chances are that at some point on a large project you’ve had to deal with a convoluted, labyrinthine stylesheet that never stops growing. Some stylesheets can feel like a messy entangled web of inheritance.<\/p>\n","protected":false},"author":245300,"featured_media":0,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_bbp_topic_count":0,"_bbp_reply_count":0,"_bbp_total_topic_count":0,"_bbp_total_reply_count":0,"_bbp_voice_count":0,"_bbp_anonymous_reply_count":0,"_bbp_topic_count_hidden":0,"_bbp_reply_count_hidden":0,"_bbp_forum_subforum_count":0,"sig_custom_text":"","sig_image_type":"featured-image","sig_custom_image":0,"sig_is_disabled":false,"inline_featured_image":false,"c2c_always_allow_admin_comments":false,"footnotes":"","jetpack_publicize_message":"","jetpack_is_tweetstorm":false,"jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":false,"jetpack_social_options":[]},"categories":[4],"tags":[804],"jetpack_publicize_connections":[],"acf":[],"jetpack_featured_media_url":"","jetpack-related-posts":[{"id":362578,"url":"https:\/\/css-tricks.com\/thierry-koblentz-atomic-css\/","url_meta":{"origin":262610,"position":0},"title":"The Making of Atomic CSS: An Interview With Thierry Koblentz","date":"February 3, 2022","format":false,"excerpt":"I interviewed Thierry Koblentz, creator of Atomic CSS, to understand the history and background that led to making of the popular CSS framework. Thierry, now retired, has vast experience writing CSS at large scale and has previously worked as a front-end engineer at Yahoo!. Thierry is widely credited with bringing\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/atomic-css-pieces.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":332556,"url":"https:\/\/css-tricks.com\/on-auto-generated-atomic-css\/","url_meta":{"origin":262610,"position":1},"title":"On Auto-Generated Atomic CSS","date":"January 15, 2021","format":false,"excerpt":"Robin Weser's \"The Shorthand-Longhand Problem in Atomic CSS\" in an interesting journey through a tricky problem. The point is that when you take on the job of converting something HTML and CSS-like into actual HTML and CSS, there are edge cases that you'll have to program yourself out of, if\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/01\/atomic-css-pieces.jpg?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":357234,"url":"https:\/\/css-tricks.com\/reimagine-atomic-css\/","url_meta":{"origin":262610,"position":2},"title":"Reimagine Atomic CSS","date":"November 19, 2021","format":false,"excerpt":"I'm not the biggest fan of Atomic CSS myself. I don't like all the classes. I like to express my styles in CSS because I find CSS... good. But I appreciate that a lot of people seem to like it, and it does have some clear advantages, like the fact\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2021\/11\/unocss-pattern-no-bg.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":331314,"url":"https:\/\/css-tricks.com\/retrospective-on-fela\/","url_meta":{"origin":262610,"position":3},"title":"Retrospective on Fela","date":"December 21, 2020","format":false,"excerpt":"I really appreciate a real-world walkthrough of a technology. Not only in what that technology does, but why it was chosen and how it worked for a team. Anybody can read the docs, but what you know after years of real-world usage is far more valuable. Kitty Giraudel: I want\u2026","rel":"","context":"In "Link"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/12\/Screen-Shot-2020-12-21-at-7.42.46-AM.png?fit=1200%2C608&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":313139,"url":"https:\/\/css-tricks.com\/responsive-styling-using-attribute-selectors\/","url_meta":{"origin":262610,"position":4},"title":"Responsive Styling Using Attribute Selectors","date":"June 30, 2020","format":false,"excerpt":"One of the challenges we face when implementing class-based atomic styling is that it often depends on a specific breakpoint for context. We can prefix each breakpoint. This works well until we start adding multiple classes. That\u2019s when it becomes difficult to keep a track what relates to what and\u2026","rel":"","context":"In "Article"","img":{"alt_text":"","src":"https:\/\/i0.wp.com\/css-tricks.com\/wp-content\/uploads\/2020\/06\/atomic-css-attributes-1.png?fit=1200%2C600&ssl=1&resize=350%2C200","width":350,"height":200},"classes":[]},{"id":183071,"url":"https:\/\/css-tricks.com\/amcss\/","url_meta":{"origin":262610,"position":5},"title":"AMCSS","date":"September 15, 2014","format":false,"excerpt":"\"Attribute Modules for CSS\" An idea by Glen Maddern for moving styling with attributes rather than classes. Not an entirely new concept, but it's interesting to give it a name and explain a system based around it. Thoughts: It avoids namespacing. Using modifiers like \"large\" is often a tempting naming\u2026","rel":"","context":"In "Link"","img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"featured_media_src_url":null,"_links":{"self":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/262610"}],"collection":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/users\/245300"}],"replies":[{"embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/comments?post=262610"}],"version-history":[{"count":8,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/262610\/revisions"}],"predecessor-version":[{"id":262818,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/posts\/262610\/revisions\/262818"}],"wp:attachment":[{"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/media?parent=262610"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/categories?post=262610"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/css-tricks.com\/wp-json\/wp\/v2\/tags?post=262610"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}