[css3-values] feedback

I have a new unit to propose that you may not have considered. Currently
there is a way to use the width of the containing element in a CSS value:
%. But what about the element's *own width?* Let's suppose you want to
overlap one element halfway over of another, or set borders on an element
based on the width of that element. How cool would that be? My proposed new
unit would be called el (pronounced like the first syllable of "element")
and would be shorthand for 100% of the element's width. I would use this
syntax:

<decimal number value>el
or
<percentage>el

Examples:

border: .005el solid;
margin: auto -50%el;

Currently the best way to use the element's width in a value requires
JavaScript to accomplish. There exists a workaround for the overlap trick,
but it requires absolute positioning and transform tricks (transform uses
percentages of the element's actual dimensions) and is extremely
temperamental in some contexts. Why not just set the element's width
explicitly, you ask? Because sometimes you just don't know ahead of time
what size you're going to need, and setting width ahead of knowing what the
result might be can lead to a formatting nightmare! That's why I'm
proposing this solution.

Received on Tuesday, 18 February 2014 17:30:19 UTC