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

> On Jan 8, 2016, at 08:30, Jihye Hong <jh.hong@lge.com> wrote:
> 
> Do we need to drop 'polar-anchor'? 
> 'polar-anchor' would improve the flexibility of CSS positioning and avoid
> the overflowing problem.

I agree that polar-anchor is useful for increased flexibility, for example if the element you're positioning has an odd shape, and its visual "center of gravity" is not at height/2 width/2 (e.g. border-radius: 50%/10% 10% 90% 90%).

On the other hand, I don't think it is a good tool for avoiding the overflowing problem.

"polar-distance: 100% contain;" is easier to use and more reliable than using polar-anchor to avoid overflow.


For example:

#containing-block {
 width: 400px; height 400px;
 border-radius: 200px/150px;
 border: 5px solid black;

 position: relative;
}

#pp {
  width: 100px; height: 70px;
  border: 3px solid black;
  border-radius: 50%;

  position: absolute;
  polar-angle: 30deg;
  polar-distance: 100% contain;
}

For something like this, trying to use polar-anchor instead of "contain" to put the anchor just at the right spot so that the two borders just touch would be pretty tricky. And if the width or height of the containing block had been something else that a fixed size (auto, percentage...), then it would be impossible to get right.

> So I prefer to find a different name than center.
> Previously, I suggested 'box-origin' or 'origin-point'.

Agreed, if we keep the "center" proposition and "polar-anchor", they'll need new names.

center ->  box-align?
polar-anchor -> box-anchor?

 - Florian

Received on Friday, 8 January 2016 01:43:35 UTC