I have a very strange problem that I can't solve.

I have an application being created with draggable divs.

Everything was working fine so far. But since a few hours, as soon as I drop a draggable div, most of the divs on my page disappear, even though they are not related to the element at all!

As soon as I resize my page, the divs reappear. It's as if it's a display bug. Moreover, this problem only happens on Chrome. No error message is displayed though.

Does anyone have any idea what this could be?

Thanks a lot.

CodePudding user response：

Google is aware if this problem and they fixed it in Chrome version 107, which is currently in Beta status. I was facing the same issue so I installed the Beta version and confirmed it is resolved. You can download the beta here: https://www.google.com/chrome/beta/

I would also mention that this problem started with Chrome version 106, which is the latest stable version as of today.

CodePudding user response：

Until Chrome is fixed, I found this workaround which fixes the problem. Add this style to the draggable element:

background-position: 0; transform: translate(0, 0);