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

Use :has() to activate fillable containers in tandem with fill items #388

Open
gadenbuie opened this issue Jul 18, 2023 · 0 comments
Open

Comments

@gadenbuie
Copy link
Member

gadenbuie commented Jul 18, 2023

When (or if) support for :has() lands in Firefox or generally picks up, it could be nice to refactor fillable containers such that they only become flex containers when they include a fillable item as a direct child.

The immediate advantage of this approach would be that elements in a card body or other fillable container would be spaced "as expected", i.e. as if they were in a normal display: block container. Currently, the display: flex of .html-fill-container (fillable containers) changes the ideal spacing module from margin to gap, and bslib does some work to internally pick the right one.

.html-fill-container:has(> .html-fill-item) {
  display: flex;
  flex-direction: column;
  width: 100%;
  min-width: 0;
  min-height: 0;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

1 participant