WordPress.org

Make WordPress Core

Opened 3 weeks ago

Last modified 2 days ago

#48722 assigned defect (bug)

Twenty Sixteen shows redundant borders for table in 5.3

Reported by: noyle Owned by: nielslange
Milestone: 5.3.1 Priority: normal
Severity: normal Version: 5.3
Component: Bundled Theme Keywords: has-patch needs-testing has-screenshots
Focuses: css Cc:
PR Number:

Description

I don't know if Twenty Sixteen theme is still supported by WP 5.3 or if the theme problem should be reported here, but..

As of WP 5.3, the Gutenberg table block is inserted within a figure tag

<figure class="wp-block-table is-style-regular">
<table class=...
...
</figure>

but only bare table is inserted in WP prior 5.3. So the CSS for displaying a figure tag will add extra borders in top & left in WP 5.3 with the Twenty Sixteen theme.

See this link for example: https://noyle.home.blog/2019/11/19/19/.

There could be other blocks start getting a figure tag wrapper around themselves which will show a top and a left border for them. And the affected themes should not be limited to Twenty Sixteen.

Attachments (12)

48722.diff (1.4 KB) - added by nielslange 2 weeks ago.
#48722-editor-default-before.png (284.4 KB) - added by nielslange 2 weeks ago.
Editor - default style - before
#48722-editor-default-after.png (239.0 KB) - added by nielslange 2 weeks ago.
Editor - default style - after
#48722-editor-stripes-before.png (283.6 KB) - added by nielslange 2 weeks ago.
Editor - stripes style - before
#48722-editor-stripes-after.png (238.8 KB) - added by nielslange 2 weeks ago.
Editor - stripes style - after
#48722-post-default-before.png (179.5 KB) - added by nielslange 2 weeks ago.
Post - default style - before
#48722-post-default-after.png (178.8 KB) - added by nielslange 2 weeks ago.
Post - default style - after
#48722-post-stripes-before.png (177.5 KB) - added by nielslange 2 weeks ago.
Post - stripes style - before
#48722-post-stripes-after.png (178.2 KB) - added by nielslange 2 weeks ago.
Post - stripes style - after
Post 47 – A WordPress Site.png (27.2 KB) - added by noyle 6 days ago.
Tables-wordpress-5.3.png (24.9 KB) - added by noyle 2 days ago.
Fresh new install of WordPress 5.3 and applied the patch.
Tables-wordpress-5.3-admin.png (21.4 KB) - added by noyle 2 days ago.
Fresh new install of WordPress 5.3 and applied the patch. The look under admin.

Download all attachments as: .zip

Change History (19)

#1 @SergeyBiryukov
2 weeks ago

  • Component changed from Themes to Bundled Theme

#2 @nielslange
2 weeks ago

  • Keywords needs-patch added
  • Owner set to nielslange
  • Status changed from new to assigned

@nielslange
2 weeks ago

@nielslange
2 weeks ago

Editor - default style - before

@nielslange
2 weeks ago

Editor - default style - after

@nielslange
2 weeks ago

Editor - stripes style - before

@nielslange
2 weeks ago

Editor - stripes style - after

@nielslange
2 weeks ago

Post - default style - before

@nielslange
2 weeks ago

Post - default style - after

@nielslange
2 weeks ago

Post - stripes style - before

@nielslange
2 weeks ago

Post - stripes style - after

#3 @nielslange
2 weeks ago

  • Keywords has-patch needs-testing has-screenshots added; needs-patch removed
  • Milestone changed from Awaiting Review to 5.3.1

#4 @nielslange
13 days ago

@noyle Thank you very much for reporting this issue! Could you test is the patch fixed the reported issue on your end?

#5 @noyle
6 days ago

Thanks for looking into it and sorry for a separated reply.

I've applied patches for the two CSS files in my local site that is upgraded from 5.2. The block editor now shows correctly for strips style table. However in the front end, default style table now shows extra borders. Firefox calculates the border width as 3px for that <figure> block.

@noyle
2 days ago

Fresh new install of WordPress 5.3 and applied the patch.

@noyle
2 days ago

Fresh new install of WordPress 5.3 and applied the patch. The look under admin.

#6 @noyle
2 days ago

Hi @nielslange, I've uploaded two more screenshots from a new WordPress 5.3 install with provided patch, in Firefox. Both default table and strips table have undesired borders.

HTML codos are:

<figure class="wp-block-table"><table class=""><tbody><tr><td>default</td><td>table</td></tr><tr><td>row</td><td>two</td></tr><tr><td></td><td></td></tr><tr><td>last</td><td>row</td></tr></tbody></table></figure>

<figure class="wp-block-table is-style-stripes"><table class=""><tbody><tr><td>stripes</td><td>table</td></tr><tr><td>row</td><td>two</td></tr><tr><td></td><td></td></tr><tr><td>last</td><td>row</td></tr></tbody></table></figure>

This ticket was mentioned in Slack in #core by audrasjb. View the logs.


2 days ago

Note: See TracTickets for help on using tickets.