Quantity Queries for CSS

This is a good article. It presents a provocative idea, exploring the use of CSS in clever and not obvious ways.<p>It&#x27;s sort of but not really &quot;hackish&quot; because he uses perfectly legitimate, if relatively obscure features of CSS, things we ought to know but haven&#x27;t studied enough.<p>The result is an elegant approach to responsive design. Templates and other tools no doubt use such approaches under the hood. A few lines of CSS doing the job without having to drag along the bloat of a framework is a very good result.<p>Having the knowledge to directly apply CSS to achieve design goals is enormously powerful and worth learning about.

It drives me nuts how much work we put into making CSS something that it is not. Why are we trying to do scripting with CSS? I can really appreciate the approach taken by React to move style definitions into Javascript, and more specifically into the file of the module whose styles they define.<p>I&#x27;m really just repeating what was said by a Facebook developer (I&#x27;ve forgotten his name at this moment) - but I think it is worth being said: CSS is more a separation of technology, than a separation of concerns. It makes much more sense to have all your code (styles, scripts, markup) in one file for a specific module. Any repeated styles&#x2F;scripts&#x2F;markup can be imported as a module.<p>In hindsight, it makes me wonder what the hell I&#x27;ve been thinking all this time.

How much longer until we discover enough logic operations to write a full raytracer in css?

(Ab)using css3&#x27;s :nth-child selector to invent new ones <a href="https://grack.com/blog/2015/01/09/abusing-css3-selectors/" rel="nofollow">https:&#x2F;&#x2F;grack.com&#x2F;blog&#x2F;2015&#x2F;01&#x2F;09&#x2F;abusing-css3-selectors&#x2F;</a>

A bit of a plug but we once made a CSS only tic-tac-toe using the same technique: <a href="http://html5advent2011.digitpaint.nl/23/index.html" rel="nofollow">http:&#x2F;&#x2F;html5advent2011.digitpaint.nl&#x2F;23&#x2F;index.html</a>

Author says he is doing this because of &quot;separation of concerns&quot; and CSS should be strictly in charge of layout. Unfortunately I think this article shows that CSS needs to be much more powerful than it currently is to achieve that goal.<p>I&#x27;m not putting this in my CSS just to satisfy some noble goal of &quot;layout versus presentation&quot;:<p><pre><code> li:nth-last-child(-n+6):first-child, li:nth-last-child(-n+6):first-child ~ li { &#x2F;* properties here *&#x2F; } </code></pre> It&#x27;s too cryptic. I feel another more important noble goal is to keep your CSS readable and understandable.

I&#x27;d feel more comfortable modelling this type of layout change with a conditional class added by the CMS itself, given that&#x27;s presumed the source of such content variability.

Tricky! Now I bet someone will write a SASS mixin library to obscure these &quot;hacks&quot;. I&#x27;m banking on seeing that on HN next week.

I think that CSS should include something like XSLT transformations allowing developer to output site markup with simple semantic elements and then designer can transform those elements into anything he need, count elements, add classes, whatever. And then style result of those transformations with traditional CSS rules.

This feels very hacky to me.