Designing websites keeping floating tab bar of Safari 15 (on iOS) in mind

1 · Amit Merchant · Sept. 1, 2021, 6:42 p.m.
The newest version of Safari, i.e Safari 15, on iOS is great. It comes with an all-new layout and a new way of navigating websites on it. Essentially, the address bar is now moved to the bottom of the screen and it now adjusts itself as you scroll the website. As you swipe on a webpage, the tab bar minimizes into the bottom of the app. Swipe back up or tap at the bottom to make the tab bar reappear. The problem The safe-area-inset-* properties So, for instance, if the website would look someth...