(Interesting) chrome versions hide the bug of displaying unspecified symbols on display: flex and overflow, chromeflex
The project encountered a very interesting situation:
The layout requirement is as follows: the new order created on the right side is a fixed width of 80 PX, the adaptive width on the left side, and overflow and hiding. For example.
The layout here is not to mention the use of display: flex. Left flex: 1; right width: 80px ;.
It was originally OK on my machine, but after it was handed over to the back-end Brothers, there was no flex: 1 on the left of his machine;
Always there with a fixed width to destroy the layout. Later I checked that chrome on the backend is the latest version,
My machine is an old version. The chrome of the two versions has different resolutions for display: flex.
The solution is to add a minimum width to the flex adaptive element on the left and a width: 100% to the two sublevels.
It's not uncommon, but it's interesting, because in my world view, I always think that the newer the version, the better the adaptability, the more interesting the bug is.