Re: [css3-values] feedback

This idea sounds good however I would worry that having multiple unit names concatenated after one another could make it all to easy to miss the percentage (%) symbol (either when reading or writing).

perhaps it would need to be standardised to be a decimal number so:


would be the same as 

50% of the element

Additionally, it would also make it easier to see cases where the el is set to 2x the width of the containing element, (so we are forcing it to overflow). So this would equal 2el.

i could see using this for carouselís as rather than working out how wide the sliding element should be we could simply put Xel where X is the number of slides.

Let me know your thoughts on these tweaks to your idea?


Jonathan Fielding

On 10 Feb 2014, at 20:54, Brian J. Fink <> wrote:

> 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 18:18:17 UTC