Is there a way to fix the issue of a white margin appearing when the address bar disappears on Safari iOS in Webflow?

Yes, there is a way to fix the issue of a white margin appearing when the address bar disappears on Safari iOS in Webflow. This issue occurs because Safari on iOS dynamically resizes the viewport when the address bar disappears, resulting in a white margin at the bottom of the screen. To fix this issue, you can follow these steps:

1. Open your Webflow project and navigate to the affected page.
2. Select the body element in the Navigator panel on the left.
3. In the Style panel on the right, click the "+" icon next to "Body" to add a new style rule.
4. Give the new style rule a class name, for example, "no-margin".
5. In the Selector field, enter ".no-margin".
6. Now, add the following custom CSS code to the Style panel:

.no-margin {  height: 100vh;}

1. Publish your site and test it on Safari iOS. The white margin should be removed now.

This CSS code sets the height of the body element to 100vh (viewport height) when the "no-margin" class is applied. This ensures that the body element takes up the entire height of the viewport, preventing the white margin from appearing.

Please note that adding this custom CSS will affect the entire page, so make sure to test it across different screen sizes to ensure it doesn't cause any unintended layout issues.