- From: Tab Atkins Jr. <jackalmage@gmail.com>
- Date: Tue, 1 Mar 2016 10:44:35 -0800
- To: Xidorn Quan <quanxunzhen@gmail.com>
- Cc: Felipe Nascimento de Moura <felipenmoura@gmail.com>, www-style <www-style@w3.org>
On Tue, Mar 1, 2016 at 6:34 AM, Xidorn Quan <quanxunzhen@gmail.com> wrote: > On Tue, Mar 1, 2016 at 10:16 PM, Felipe Nascimento de Moura > <felipenmoura@gmail.com> wrote: >> Hm, weird. >> In this example of mine, it is not working: >> http://jsbin.com/kesutoyoyo/3/edit?css,output >> >> Am I missing something here?! > > It seems to me this is because calc() can not be nested. > > Variables are stored as syntax sequence and expanded when used. So in > your code, for example, the line "left: var(--middle);" is expanded to > "left: calc(calc(150px*2)/2 - 2px);". The nested calc is not supported > here, so this line is dropped. > > You can, for example, do something like >> --cursize: (var(--size)*2); >> --middle: (var(--size)/2); >> left: calc(var(--middle)); > which should work then. Note that calc() *should* be nestable, per spec. A calc() inside of a calc() is identical to just parentheses. ~TJ
Received on Tuesday, 1 March 2016 18:45:23 UTC