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

Table Block: alignment options are inconsistent and do not show up on the front end #9778

Closed
designsimply opened this issue Sep 11, 2018 · 3 comments · Fixed by #10468
Closed
Assignees
Labels
[Feature] Blocks Overall functionality of blocks [Type] Bug An existing feature does not function as intended
Milestone

Comments

@designsimply
Copy link
Member

Steps to reproduce:

  1. Create a new post and add a table block with some text in each cell.
  2. Click the "Align center" option in the toolbar to center all of the text.
  3. Publish the post and view it on the front end.
  4. Edit the post and choose the "Align right" option.
  5. Update the post and view it on the front end.

Result: centering makes the table appear full width and all text centered in the editor but neither is centered when the table is viewed on the front-end. Right aligning the table make the table move to the right but the text is not affected and neither the table nor the text is right-aligned on the front end.

h/t Radu Constantin for the report at https://make.wordpress.org/test/2018/09/05/call-for-testing-gutenberg-3-8-pre-release/#comment-1042

screen shot 2018-09-10 at 7 34 00 pm

screen shot 2018-09-10 at 7 49 04 pm

screen shot 2018-09-10 at 7 45 39 pm

screen shot 2018-09-10 at 7 48 03 pm

Seen at https://madefortesting.com/wp-admin/post.php?post=507&action=edit and https://madefortesting.com/2018/09/11/table/ running WordPress 4.9.8 and Gutenberg 3.8.0-rc.1 with the Twenty Seventeen theme active and using Firefox 62.0 on macOS 10.13.6.

@designsimply designsimply added [Type] Bug An existing feature does not function as intended [Feature] Blocks Overall functionality of blocks labels Sep 11, 2018
@cristian-raiber
Copy link
Contributor

The "Align center" option adds a data-align="center" attribute to editor-block-list__block, which adds the rule

.editor-block-list__block[data-align="center"] {
    text-align: center;
}

Removing this rule will stop text from being centered in the table (which I think is the desired functionality because the rest of the alignment options don't align the text inside the table, not even on the front end). But this might break the alignment for other core blocks in the editor.

@mtias
Copy link
Member

mtias commented Oct 8, 2018

@talldan do we have more actionable pieces here?

@talldan
Copy link
Contributor

talldan commented Oct 10, 2018

@mtias - thanks for the ping. I'll pick this one up asap.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Feature] Blocks Overall functionality of blocks [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants