W3C home > Mailing lists > Public > www-style@w3.org > April 2012

Functional notation of `rem` unit to refer to font-size of ancestor of specific level

From: Marat Tanalin | tanalin.com <mtanalin@yandex.ru>
Date: Sun, 01 Apr 2012 22:15:35 +0400
To: "www-style@w3.org Style" <www-style@w3.org>
Message-Id: <508691333304136@web31.yandex.ru>

It would be nice to be able to set element's font-size based on font-size of one of its ancestor elements.

Currently, we have `rem` unit for similar purpose, but it's hardly binded to font-size of _root_ element (`HTML` element in case of HTML documents). This complicates creating modular/standalone blocks which needs to have font-size that does not depend on font-size of root element, but font-size of descendant elements of that standalone block should depend on font-size of latter.

We could extend `rem` unit with functional notation having one parameter meaning parent level:

    HTML {font-size: .8125em; }
    UL {font-size: 13px; }
    UL > LI {font-size: 0; }
    UL > LI > SPAN {font-size: 1rem(2); }

here 2 inside parentheses is level of ancestor to be used as reference element for font-size (`LI` here is first level, `UL` is second one). So `SPAN` element will have 13px font-size. We cannot use `rem` unit here since `UL` element has pixel font-size while `HTML` element has `em` font-size that depends on system/browser settings. We cannot use `em` unit either -- since font-size of direct-parent element (`LI`) is zero.

If reusing `rem` for this purpose will seem any problematic, it's OK to name it differently: for example, `pem` (parent em) or `aem` (ancestor em). What important here is the idea itself.


P.S. No, it's not a 1-april joke. ;-)
Received on Sunday, 1 April 2012 18:16:06 UTC

This archive was generated by hypermail 2.3.1 : Monday, 2 May 2016 14:38:57 UTC