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.

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

Button: display + contain values lead to extra space in containing element #746

Open
daneah opened this issue Apr 25, 2024 · 0 comments
Open

Comments

@daneah
Copy link
Member

daneah commented Apr 25, 2024

Expected behavior

  • A button's rendered content touches all four walls of its real estate
  • Elements around the button also behave such that those four walls are the button's edges

Actual behavior

The button itself does touch all four of its walls:

Screenshot 2024-04-25 at 14 33 40

But a containing div placed around it can be observed to have extra space below:

Screenshot 2024-04-25 at 14 35 05

This appears to be due to some combination of the contain: layout and display: inline-flex used for buttons.

This is observable in Storybook as well.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

1 participant