resolve avatar block alignment issue. #67419
Conversation
|
The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message. To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook. |
github-actions
bot
added
the
First-time Contributor
|
👋 Thanks for your first Pull Request and for helping build the future of Gutenberg and WordPress, @NidhiDhandhukiya74! In case you missed it, we'd love to have you join us in our Slack community. If you want to learn more about WordPress development in general, check out the Core Handbook full of helpful information. |
t-hamano
added
[Type] Bug
|
This resolves the |
NidhiDhandhukiya74
force-pushed
the
resolve-alignment-in-avatar
branch
from
5e837af to
2c38d25
Compare
|
Hello @Mayank-Tripathi32 In your Pr you have added solution for align-right but you have not added my code which is for align center in classic themes. |
Hello, I have made some modifications in #67494, which fixes the wrapper itself instead of adding css. Please have a look. |
| .components-resizable-box__container { | ||
| margin: 0 auto; | ||
| } | ||
| } | ||
|
|
||
| .wp-block-avatar.alignright { |
There was a problem hiding this comment.
This is not required as changes made are not required anymore. See #67494
What?
Resolve the mentioned issue of :- #56706
This pull request resolves an issue where the Avatar block is not properly center-aligned in the editor when the "Link to user profile" option is enabled. The alignment issue primarily affects themes like Twenty Seventeen, Twenty Nineteen, Twenty Sixteen, and Twenty Twenty-One. However, the alignment works as expected in Twenty Twenty-Two and Twenty Twenty-Three.
why
The problem occurs because the necessary CSS styles to center the Avatar block are missing in the editor. This leads to inconsistent alignment behavior across themes when the block is center-aligned. Since this is an editor-side issue, the fix must first be implemented in the Gutenberg plugin to ensure proper alignment before checking for any related issues in the core.
Testing Instructions
Setup:
Use one of the affected themes: Twenty Seventeen, Twenty Nineteen, Twenty Sixteen, or Twenty Twenty-One.
Ensure the Gutenberg plugin is activated.
Steps to Reproduce:
Add an Avatar Block to a post or page in the editor.
Enable the "Link to user profile" option in the block settings.
Center-align the Avatar block using the alignment controls in the block toolbar.
Expected Behavior:
The Avatar block should appear centered in both the editor and the frontend.
The alignment issue should no longer persist across affected themes.
Additional Verification:
Repeat the same steps with themes like Twenty Twenty-Two and Twenty Twenty-Three to confirm that the fix does not introduce any regressions in themes where the alignment already works correctly.