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

Enhance block spacing gap config to also target the first block in a container #34441

Closed
jasmussen opened this issue Sep 1, 2021 · 2 comments · Fixed by #35426
Closed

Enhance block spacing gap config to also target the first block in a container #34441

jasmussen opened this issue Sep 1, 2021 · 2 comments · Fixed by #35426
Assignees
Labels
[Status] In Progress Tracking issues with work in progress [Type] Code Quality Issues or PRs that relate to code quality [Type] Enhancement A suggestion for improvement. [Type] Task Issues or PRs that have been broken down into an individual action to take

Comments

@jasmussen
Copy link
Contributor

#33812 added a blockGap property to theme.json which enabled spacing blocks inside a container using a simpler set of rules:

[.container] > * + * {
	margin-top: var( --wp--style--block-gap );
	margin-bottom: 0;
}

In effect this simplifies margins to be between blocks rather than both before and after, simplifying first-child/last-child rules and margin collapsing.

However at the moment, the rule only targets n+1 blocks:

A fix would be to also output the following rule:

[.container] > * {
	margin-top: 0;
	margin-bottom: 0;
};

That would ensure there are no default margins interfering with the first block in a stack.

@jasmussen jasmussen added [Type] Task Issues or PRs that have been broken down into an individual action to take [Type] Enhancement A suggestion for improvement. [Type] Code Quality Issues or PRs that relate to code quality labels Sep 1, 2021
@jasmussen
Copy link
Contributor Author

CC: @youknowriad, just as a followup to #33812 (comment).

@richtabor
Copy link
Member

+1 — I noticed the same as I explored blockGap this morning.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Status] In Progress Tracking issues with work in progress [Type] Code Quality Issues or PRs that relate to code quality [Type] Enhancement A suggestion for improvement. [Type] Task Issues or PRs that have been broken down into an individual action to take
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants