The page: https://wangyifang.com is normal on Chrome for macOS, but on safari for macOS and safari for ipad, there is this weird line break, and some are normal and some will be line break, and when you delete or add text to the line break, there is always a line break, and it seems to be related to the picture in front of it. https://i.imgur.com/0GJu7SG.png
In chrome (macos, win, android), if you change the width of the image in front of the text, the width will be automatically pulled up and the text will not change: https://i.imgur.com/FyO53fo.png
But on safari and ipad chrome, modifying the width of this image, the size of the box outside does not change, which then causes the width of the text on the right to automatically become smaller, and then it:https://i.imgur.com/h1CHfbq.png
I simplified the code: https://wangyifang.com/share/safari.html
PS: On chrome for ipad, the display misalignment is even more serious, and there is a very high blank at the bottom of the page, which seems to be caused by a background of the page.