cloudhead/less.js — Issue #525: Traverse back up the tree
Author: zslabs
Created: 2011-12-14 20:56:30+00:00
State: open

Hi,
I'm sorry if this has been asked before, but I haven't been able to find if this is possible or not.

Sometimes, those crap browsers (you guessed it, IE) sometimes need to have slight modifications to elements to make them alll pretty. Another occurrence is when using Modernizr, when you need to specify a safe fallback for browsers that do not support certain features.

Obviously nested CSS is AMAZING and keeps everything very well organized - but is there a way to go back up the tree without loosing the organization of the CSS? For example:

How I would normally do this now:

#element {

.elementShadow {
box-shadow: 5px 5px 5px #ccc;
}
}

.ie7 {

#element {

.elementShadow {
border:1px solid #ccc;
}
}
}

How I'd REALLY like to be able to do that same thing:

#element {

.elementShadow {
box-shadow: 5px 5px 5px #ccc;
}

^body.ie9^ .elementShadow {
border:1px solid #ccc;
}
}

Obviously I'm pulling those ^^ out of my ass, but I think you might get my point. I also realize this could have some dramatic issues about organization as a whole (if it was overused), but I think this could be useful. Thanks!