Make a CSS property depend to another [duplicate]

Question

I would like to make one of my CSS property proportional to another, but none is parent of the other one. It would looks like this:

elem-to-look {
    /**
     * This value could not be explicit,
     * And I want it to working even with default values.
     */
    width: 50px;
}

elem-derivative {
    /* I'm looking for something like this */
    left: [elem-to-look: width] + 25px;
}

Is it even possible ? If no, what kind of solution would you advise me ?

Answer 1

Well, it is hard, but under some conditions you can do that.

If your body font-size is stable and you don't change it in parents of your elements, you can do the following:

body {
    font-size: 20px;
}

elem-to-look {
    width: 2.5em;
}

elem-derivative {
    left: calc(2.5em + 25px);
}

If this satisfies you, that could work.