Editor styles flip alignright and alignleft positioning

[laurelfulford]

Describe the bug
When using an RTL language (or an RTL testing plugin), the .alignleft class aligns right, and the .alignright class aligns left in the edit-blocks-rtl.css enqueued from Gutenberg.

To Reproduce
Steps to reproduce the behavior:

1. Add a quote block to a post.
2. Using the Advanced options, add the alignleft class.
3. Confirm that the quote is aligned left in the editor preview.
4. Switch the site to RTL (you can do this using a testing plugin like RTL Tester).

Expected behavior

The quote will stay left-aligned, to match the class name -- it shouldn't change when the language direction does.

Actual behavior

Both .alignleft and .alignright switch float directions - I'm guessing this is coming from automatically generated RTL styles.

Screenshots

Here's a quote block with the alignleft class, and the styles coming from edit-blocks-rtl.css that are aligning it right:

The theme in the above screenshot is Twenty Sixteen; I was also able to recreate this with the Gutenberg starter theme.

[designsimply]

Related: #10663

[laurelfulford]

I'm noticing this on the front-end too while working on the default themes. I haven't noticed it in all of them -- I suspect because the theme itself has styles that are overriding it -- but here's an example from Twenty Fourteen:

In the stylesheet /plugins/gutenberg/build/block-library/style-rtl.css, .wp-block-image.alignleft is being set to float right. It looks like a bit of a mess because the theme's RTL styles 'assume' that a left-aligned element will stay on the left.

[liloo2040]

Hi !

I am sorry, I have tried to replicate what you did and unfortunately, I don't have the same results as you.

Example : when I switch from ltr to rtl (with css - customized or in a css file), it works. When I do alignleft, it goes to right and the other way around too.

I hope that helped you a bit more.

[paaljoachim]

Hey @laurelfulford Laurel and others it would be great with an update. To hear if this issue still has the same problem.
How can we move it forward?
Thanks!

[glendaviesnz]

I wasn't able to replicate this on WP 5.8, Gutenberg 11.3 and TwentyTwentyOne theme:

So closing for now, feel free to reopen @laurelfulford if you can still replicate.