Re: [css-round-display] Positioning elements with polar positioning and absolute positioning

Brad Kemper

On Dec 29, 2015, at 1:16 AM, Jihye Hong <jh.hong@lge.com> wrote:

>> On Dec 24, 2015, at 1:56 AM, Brad Kemper <brad.kemper@gmail.com> wrote:
>> 
>> Your last proposal is actually quite close to what I was proposing.
>> 
>>> On Dec 22, 2015, at 10:02 PM, Jihye Hong <jh.hong@lge.com> wrote:
>>> 
>>> On the other hand, 'center' seems to be no different from the 'polar-
>> origin'
>>> to me.
>> 
>> Which is why it will be abused for uses which have nothing to do with
>> polar movement. What I'm saying is that sort of positioning by the
>> center of the positioned element is more generally useful.
>> 
>> (I might have said polar-anchor before, when I meant polar-origin.  I
>> keep getting the names mixed up. )
>> 
>>> Using 'polar-origin' is enough for finding the origin of the polar
>> movement.
>> 
>> So, if I didn't need to move something at an angle, but instead just
>> wanted the center to align with a point 75% of the way across the
>> containing block, you are saying I would do this:
>> 
>> Position:absolute;
>> Polar-distance:0;
>> Polar-origin: 75% 50%;
>> 
>> Instead of this:
>> 
>> Position:absolute;
>> center: 75% 50%;
>> 
>> 
>> If we want 'center' to only work if the other edge position values (t,
>> r, b, l) are 'auto', then that was one of my alternative proposals
>> anyway (the last one). That would mean that my proposal is ALMOST
>> exactly the same as yours, except:
>> 
>> 1. 'Polar-origin' is named 'center' instead.
>> 
>> 2. 'polar-*' is not required at all in order to use 'center'.
>> 
>> 3. 'Center' is a shorthand for '<center-x> <center-y>'.
>> 
>> 4. 'center-x' or 'center-y' could be 'auto' without both of them being
>> 'auto'.
> 
> So, when you use 'center' property, does it enable other polar-* properties
> to use?

No, any non-static 'position' value would enable other polar-* properties, just as they would enable 'left', 'bottom', etc. or 'center' (which could also be used in combination of the polar-* properties). 

> Is it possible to use like below?:
> 
> position: absolute;
> center: 50% 50%;
> polar-anchor: 25% 25%;

You wouldn't need polar-anchor for that. You would just do this:

position: absolute;
center: 75% 75%; /* 50% + 25% = 75% */

I am suggesting we don't need polar-anchor at all. For cases where you want to offset it from center by a non-percentage length, margin-top and margin-left work fine for this, as they have for many, many years with absolute positions set in percentage. 

The main difference between 'left' and 'center-x' is that 'left' positions the element by its left edge, whereas 'center-x' positions the element by its center (and also that 'center-x' is ignored if 'left' and/or 'right' are not 'auto'). 

> If so, then changing the definition of 'polar-origin' for the general use
> which is the 'center' property's role is worth for being considered. 

Thanks. 

> But I'm still not sure about the naming of the property as 'center' instead
> of 'polar-origin'. 
> The main feature of 'center' seems to specify the origin of the polar
> coordinates.

Incorrect. The main feature of 'center' is to specify where the center of something is positioned relative to its containing block. This can be to the center of its containing block (with '50% 50%'), or somewhere else with some other value. This can happen with or without polar- anything. 

It's separation of concerns. The main feature of 'polar-angle' and 'polar-distance' is to move something a certain distance at a certain angle. It need not be concerned with where that movement starts from. 

> Therefore including 'origin' to the property's name seems
> natural to me. For example, 'box-origin' or 'origin-point'?

The positioning-by-center that it does is not just for setting an origin for polar movement. It has other use cases too. 

> And 'center' looks little bit out of bound of the CSS Round Display Spec.
> I think it also could be discussed in another spec like CSS Positioned
> Layout [1].

Perhaps. But it is related, and if we do that, then CSS Round Display Spec should not include features that replicate what 'center' would do. It should this not talk about coordinate systems or where the origin of the polar movement starts from, as the center positioning would handle all that. You should also consider using a different word than 'polar', such as 'angular' or 'radial', since it is more about angular/radial translation than it is about a completely different coordinate system. 

Personally I think it would be OK to include 'center', 'center-x', and 'center-y' property definitions in CSS Round Display Spec. They are really not complicated to define, and they are needed and useful for use with round clock faces.