Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

[css-anchor-position-1][css-position] behavior of position-area when no anchor is defined #10500

Closed
Afif13 opened this issue Jun 26, 2024 · 3 comments
Closed

[css-anchor-position-1][css-position] behavior of position-area when no anchor is defined #10500

Afif13 opened this issue Jun 26, 2024 · 3 comments
Labels
Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. css-anchor-position-1

Comments

@Afif13
Copy link

Afif13 commented Jun 26, 2024

I just tried the below code:

.container {
  position: relative;
}
.element {
  position: absolute;
  inset-area: center;
  margin: auto;
}

And to my surprise, it center the absolute element. Demo: https://codepen.io/t_afif/pen/OJYwybK

Based on the Specification the propety applies to "positioned elements with a default anchor element". Does it mean that any positioned element has a default anchor which is its containing block?

If it's the correct behavior, I think the Spec should clarify the "default anchor" part. Or maybe this is a bug and inset-area should have no effect?
@kizu
Copy link
Member

kizu commented Jun 26, 2024

One thing I wonder about: should we relax this requirement, and if there is no default anchor, treat the containing block as one for this purpose?

From an author standpoint, nothing in inset-area says that there is some relation to the anchor, so it could be useful to allow using it without setting up the anchor itself to avoid confusion + cover some useful cases like the one @Afif13 mentions.

@jwatt
Copy link
Contributor

jwatt commented Jul 21, 2024

(Note: #10209 renamed inset-area to position-area.)

@nt1m nt1m changed the title [css-anchor-position-1][css-position] behavior of inset-area when no anchor is defined [css-anchor-position-1][css-position] behavior of position-area when no anchor is defined Jul 22, 2024
@tabatkins
Copy link
Member

This is indeed an implementation bug. The spec is clear at https://drafts.csswg.org/css-anchor-position/#position-area that if there's no default anchor element, the value does nothing; all the other effects (notably, the default alignments, which are what's happening here) are explicitly guarded under that check.

@tabatkins tabatkins added Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. css-anchor-position-1 labels Jul 24, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. css-anchor-position-1
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
4 participants
@kizu @jwatt @tabatkins @Afif13