- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Thu, 13 Sep 2012 14:09:31 -0700
- To: François REMY <fremycompany_pub@yahoo.fr>
- Cc: CSS WG <www-style@w3.org>
On Fri, Sep 7, 2012 at 2:36 AM, François REMY <fremycompany_pub@yahoo.fr> wrote: > Tab, you are again debating that "because this can't solve all the problems, > it should not exist at all". > > I don't see where the problem is to specify that we use the specified value > to resolve property references (which, as you known, includes the > inherited/initial value as neeeded). The differences between the computed > value and the specified value are close to inexistant in most cases. The > only major difference happens at 'used' time and you know as good as me that > the computed value of any property can't depend on the used value of another > one. > > I have a simple example demonstrating that referencing native properties can > be useful. I'm quite aware that they're useful. They're also difficult to do without being future-hostile to the development of CSS, or weak enough that they don't accomplish much anyway. > [1] > > If I want to have an element whose padding-left and padding right represent > 10% of the element's width, and that I have 'specified' property reference, > I can do: > > li.padded { > width: 100%; > padding: 0px calc(0.05 * use(width)); > } > > li.twocol { > width: 50%; > } Assuming that you *actually* want the specified percentage, and not the resolved <length>, this might work. > If I can't use the reference, I need to create a new custom property for the > purpose, and this will mess up my code > > * { > width: var(width); > var-width: auto; //oops, I inherit! > } > > li.padded { > var-width: 100%; > padding: 0px calc(0.05 * var(width)); > } > > li.twocol { > var-width: 50%; > } > > Now, my code is completely inefficient, just because I had to work around > the fact I can't make a reference to a native propery. If you'd written the original rule with a better selector than '*', you'd wipe out most of the inefficiency. > [2] > > I regulary need to have something like this in my code: > > a.tile { > background-color: blue; > outline-color: blue; > outline-width: 0px; > color: white; > ... > transition: all 0.3s; > } > > a.tile:hover { > background-color: royalblue; > outline-color: royalblue; > outline-width: 5px; > } > > If I could simply use a reference, the code would be better and more easily > maintainable : > > a.tile { > background-color: blue; > outline-color: use(background-color); > ... > } > > a.tile:hover { > background-color: royalblue; > } > > Again, writing the same code using a custom property would be cumbersome and > would slow down the page. > > What Brian, Chris and myself would like is a simple specified-value replacor > that works for all properties and not just for custom ones. We don't want a > complex solution that requires new internal dependencies and you are > rejecting this proposal because you don't want a simple solution but a very > complex solution that's completely impossible to build. I think that using literally just the specified value might work without problems. However, I suspect it would often end up being confusing, because the difference between 'computed' and 'specified' is normally irrelevant for authors (they can't directly observe the specified value). In any case, I see no problem with addressing this with a differently-named function than what vars use, because of some of the different details in desired behavior. ~TJ
Received on Thursday, 13 September 2012 21:10:18 UTC