Horizontal scrollbar problem in block editor

[withsalah]

After updating to WordPress 5.7. I noticed a small problem in the block editor. There is a horizontal scrollbar that makes the process of creating content messy.

&

In the previous versions, we could add blocks by clicking on the plus button between blocks. In the 5.7 version, The button goes to the left in the blank area.

Look at the following image that shows both bugs:

[SergeyBiryukov]

Hi there, welcome to WordPress Trac! Thanks for the report.

Just linking to a ticket that might be related: #52565.

[quadthemes]

@withsalah
Hey there,
Welcome to WordPress Trac!
I am not able to reproduce the issue by using RTL language.
Can you please give some more information like what browser (and which version) you're using, language, also what themes and plugins do you have installed.
It happens in some cases that some plugin/theme css broke the editor css.

[quadthemes]

Add Block Button between two blocks shift to wrong side when using Gutenberg with RTL language.

[quadthemes]

Add Block Button between two blocks shift to wrong side when using Gutenberg with RTL language.

[quadthemes]

@ryokuhi
There is one ticket related to position of add block on RTL languages on gutenberg repo: ​https://github.com/WordPress/gutenberg/issues/30867

I think this ticket can be closed now.
Also another issue seems to be more of specific browser issue or something to do with style overrides by any theme. Also I was not able to reproduce this on Chrome v89 and Firefox on Mac OS.

[ryokuhi]

Hello @withsalah,
the ticket was discussed today during the Accessibility Team's bug-scrub.
As one of the issues was reported in the Gutenberg repository and we're not able to reproduce the other, we're closing this ticket.
Feel free to reopen it if you have further feedback.

[withsalah]

Hello @ryokuhi and @quadthemes

I made a video that only explains the main problem. Leaving this problem unresolved causes other problems, and I have put two pictures that illustrate problems that occur that are not found in the video.

Video Link:
​https://youtu.be/lp2R7h7_Mrg

Problems are not in the video.

1

The + button has disappeared under the left sidebar

2

If the article has components other than texts, for example, pictures or videos, then when scrolling down the Horizontal scrollbar expands in a way that places the text badly. The following image from a real site.

---

what I use:
Google Chrome Version 89.0.4389.128 (Official Build) (64-bit)
WordPress 5.7.1
Arabic version
Twenty Twenty-One theme
No plugins

[quadthemes]

@withsalah
I am still unable to reproduce the 2nd issue. @ryokuhi Can you please try that?

Like I said earlier I was able to reproduce the first issue.
One detail I forgot to mention earlier, scrollbar appears when add block insertor button is visible.
I tried many times to produce scrollbar issue with multiple types of blocks but was unable to do so. I am only seeing scrollbar when add insertor button is visible.

Also I was able to create a fix for the first issue and will be sending pull request to Gutenberg for the same.

[joedolson]

@withsalah Can you check and see whether this issue is still a problem? The related issue in Gutenberg was (​https://github.com/WordPress/gutenberg/issues/30867) was fixed in 2021, and trying to confirm whether that resolved this issue, as well.

[joedolson]

To the best of our knowledge, this was fixed upstream in 2021, so we're closing this. However, since we don't have direct references to be able to demonstrate exactly when and how this was fixed, don't hesitate to reopen if needed.