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.

Sign up for GitHub

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

Jump to bottom

Buttons block: center-aligned buttons aren't exactly centered in the editor due to (invisible) appender #21805

Closed
iamtakashi opened this issue Apr 23, 2020 · 5 comments · Fixed by #25518
Closed

Buttons block: center-aligned buttons aren't exactly centered in the editor due to (invisible) appender #21805

iamtakashi opened this issue Apr 23, 2020 · 5 comments · Fixed by #25518
Assignees
@ZebulanStanphill
Labels
[Block] Buttons Affects the Buttons Block CSS Styling Related to editor and front end styles, CSS-specific issues. [Status] In Progress Tracking issues with work in progress [Type] Bug An existing feature does not function as intended

Comments

@iamtakashi
Copy link

I've noticed a centre aligned button is off centre in the editor. It seems to be caused by the right margin on the button and the appender.

Frame 1

Tested with Mac Chrome, Twenty Twenty theme active.

Sorry, if it has already been reported. I had a quick look, but I didn't see one mentioning the appender making the misalignment worse.
@talldan
Copy link
Contributor

talldan commented Apr 23, 2020

@iamtakashi #21685 seems like a very similar issue.

@iamtakashi
Copy link
Author

@talldan Thanks for the info. I'm seeing this issue with a fresh new button though.

@talldan talldan added [Block] Buttons Affects the Buttons Block [Type] Bug An existing feature does not function as intended labels Apr 24, 2020
@talldan
Copy link
Contributor

talldan commented Apr 24, 2020

I see that too in the editor, so I've labelled as a bug:
Screenshot 2020-04-24 at 10 59 25 am

@talldan talldan changed the title Button Block: Centre aligned button isn't centre in the editor Buttons Block: Centre aligned button isn't centre in the editor Apr 24, 2020
@talldan talldan added the CSS Styling Related to editor and front end styles, CSS-specific issues. label Apr 24, 2020
@paaljoachim paaljoachim mentioned this issue Jun 9, 2020
Closed
@paaljoachim
Copy link
Contributor

paaljoachim commented Jun 9, 2020 •
edited
Loading

I made an issue #23010 with some additional information. I closed it as a duplicate.

@paaljoachim paaljoachim mentioned this issue Jun 9, 2020
Closed
6 tasks
@iamtakashi iamtakashi mentioned this issue Aug 17, 2020
Closed
@ZebulanStanphill ZebulanStanphill changed the title Buttons Block: Centre aligned button isn't centre in the editor Buttons block: center-aligned buttons aren't exactly centered in the editor due to (invisible) appender Aug 27, 2020
@ZebulanStanphill
Copy link
Member

I've updated the title to be more descriptive. The cause of the issue is the appender (inserter button), which, although invisible when the Buttons block is unselected, still takes up space, pushing the other buttons to the left slightly.

@ZebulanStanphill ZebulanStanphill mentioned this issue Sep 21, 2020
Merged
6 tasks
@github-actions github-actions bot added the [Status] In Progress Tracking issues with work in progress label Sep 21, 2020
@ZebulanStanphill ZebulanStanphill mentioned this issue Sep 21, 2020
Merged
6 tasks
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@ZebulanStanphill ZebulanStanphill

Labels
[Block] Buttons Affects the Buttons Block CSS Styling Related to editor and front end styles, CSS-specific issues. [Status] In Progress Tracking issues with work in progress [Type] Bug An existing feature does not function as intended
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Remove appender from unselected Buttons and Social Icons block. WordPress/gutenberg
4 participants
@talldan @iamtakashi @paaljoachim @ZebulanStanphill