Skip to content

[css-align-3] Consider making vertical centering #6143

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.

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

Closed
brend8c opened this issue Mar 25, 2021 · 3 comments
Closed

[css-align-3] Consider making vertical centering #6143

brend8c opened this issue Mar 25, 2021 · 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-align-3 Current Work

Comments

@brend8c
Copy link

brend8c commented Mar 25, 2021

I want to suggest vertical centering of blocks.
It's much easier to do. For instance:
"margin: auto 0", "margin: auto auto"
Without using flex elements.

@tabatkins
Copy link
Member

While implementations have not yet caught up with the spec, it is defined that align-content: center should work on block containers, vertically centering their contents: https://drafts.csswg.org/css-align/#distribution-block

(We're hoping that this is still possible, and we don't have a bunch of existing web content accidentally relying on the property doing nothing for blocks.)

However, align-self: center is not possible in block containers, for the same reason Flexbox doesn't allow justify-self to work - there are multiple elements in the axis, and it's not clear how to reconcile each one asking for a particular alignment. *-content works because it aligns all the children as a group.

@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-align-3 Current Work labels Mar 25, 2021
@brend8c
Copy link
Author

brend8c commented Mar 25, 2021

Yes you tell right.
We know about margin: 0 auto; for horizontal centering.
But it would be logical if margin: auto 0 or margin: auto; work for vertical centering.
I'm talking about margin in order to expand its capabilities.

@tabatkins
Copy link
Member

Ah, unfortunately that can't happen. Vertical auto margins have never affected positioning, for the reason I said earlier - there are multiple elements in the vertical axis, so it's not clear how multiple children with auto vertical margins should work.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Closed as Question Answered Used when the issue is more of a question than a problem, and it's been answered. css-align-3 Current Work
Projects
None yet
Development

No branches or pull requests

2 participants