<center> tag around [video] inserts &nbsp and new lines every post update (or even switch between source and post)

[archon810]

This only seems to happen in the classic editor, which is what we're using and planning on using for years to come. The only active plugin in my test is Classic Editor ​https://wordpress.org/plugins/classic-editor/. Stock WP 2019 theme.

Tested with 5.2.3 and github master HEAD.

Example code:

<center>[video width="524" height="1080" mp4="https://example.com/wp-content/uploads/2019/09/test.mp4"][/video]</center>

If you switch between Visual and Text, you'll start seeing new lines with  s added, like so:

<center>[video width="524" height="1080" mp4="https://example.com/wp-content/uploads/2019/09/test.mp4"][/video]

&nbsp;

&nbsp;

</center>&nbsp;

[archon810]

screencast of the bug

[archon810]

A few ccs for visibility: @SergeyBiryukov @birgire @pento.

The issue was brought up to me by one of our editors who got frustrated with having to delete extra unexpected added lines in his posts with centered [video]s.

[andraganescu]

I can confirm this bug and that it only happens with the center tag.

[sabernhardt]

There are better ways to center a video than wrapping it the obsolete center tag.
(​MDN docs discourage using the tag.)

Option 1: Center all videos added with [video] shortcodes.

1. Navigate to Appearance > Customize.
2. Find the "Additional CSS" section.
3. Paste the following CSS:

   .wp-video {
   	margin-left: auto;
   	margin-right: auto;
   	text-align: center;
   }
   

4. Publish.

Option 2: Center each video individually with a div tag.

Wrap the shortcode with a div tag that includes centering styles and a max-width equal to the number of pixels defined in the video shortcode's width value.

<div style="margin-left: auto; margin-right: auto; text-align: center; max-width: 524px;">

[video width="524" height="1080" mp4="https://example.com/wp-content/uploads/2019/09/test.mp4"][/video]

</div>

If the width is always the same, you could use a class instead of a style attribute and set those styles in Additional CSS.

[azaozz]

As @sabernhardt mentions above centering content shouldn't use the old <center> tag. Looking at w3.org, that tag is "entirely obsolete, and must not be used by authors". See ​https://www.w3.org/TR/2011/WD-html5-20110405/obsolete.html#non-conforming-features. Best would be to replace it with a div as described above.

Closing as "wontfix". Please feel free to reopen if there is a reason to still support this tag despite the W3 standards.