[ionelm]

I don't think many people would disagree that CSS/HTML have certain encapsulation deficiencies. But I think that less/sass just make you more efficient at writing unmaintainable stuff.

Shadow DOM and WebComponents solve this better by encapsulating styling and markup concerned with the same widget or object. Without those you still have styling concerned with different markup in the same place. You can use less/sass but it's not true encapsulation - you still have to pay attention that you don't break styling for unrelated stuff when changing styling. Thus the "unwanted pain".

[lumpypua]

shrug I've gotten good at avoiding encapsulation problems by blowing my architectural foot off with css preprocessors a couple of times. :) I still don't have a clear system, but I've learned the how to decompose a layout over time in ways that let me reuse effectively. Usually this is by extracting emergent structure as soon as the css starts to look like a tangle. Once done, it's more clear where to throw it or fold into existing stuff.

I've been loving React for the past 6 months, but yeah Shadow DOM and WebComponents have exactly the right idea WRT encapsulation.

My main CSS gripe is purely layout. I want to do relatively simple things like make responsive multi-column layouts using relative widths where one of the columns is fixed. Turns out that's hard and needs javascript. Flexbox is a huge step forward for making interesting layouts that were difficult in CSS and trivial in UI framework layout systems.