# The navigation menu on the bottom of the page isn't being correctly displayed in Safari/Google Chrome

**URL:** <https://community.weweb.io/t/the-navigation-menu-on-the-bottom-of-the-page-isnt-being-correctly-displayed-in-safari-google-chrome/5188>\
**Category:** Ask us anything\
**Tags:** design\
**Created:** [November 3, 2023, 10:07am UTC](https://community.weweb.io/t/the-navigation-menu-on-the-bottom-of-the-page-isnt-being-correctly-displayed-in-safari-google-chrome/5188 "2023-11-03T10:07:43Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![DENjnly](https://avatars.discourse-cdn.com/v4/letter/d/8edcca/32.png) [@DENjnly](https://community.weweb.io/u/DENjnly)\
**Post date:** [November 3, 2023, 10:07am UTC](https://community.weweb.io/t/the-navigation-menu-on-the-bottom-of-the-page-isnt-being-correctly-displayed-in-safari-google-chrome/5188/1 "2023-11-03T10:07:43Z")

</div>

We’ve developed an app for mobile devices and added the navigation menu on the bottom of it. The thing is in Google Chrome this menu is not being displaying at all, and in Safari it’s blocked by the Safari Navigation menu. Maybe you know how to fix it? First screen : how it should be, second: how it looks right now in Safari.  
 ![image](https://us1.discourse-cdn.com/flex016/uploads/weweb/original/2X/f/f06c34b98a4931cf30bb081202cdade8d08b08f7.png)

---

<div class="post-metadata">

**Author:** ![Joyce](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/joyce/32/13232_2.png) [@Joyce](https://community.weweb.io/u/Joyce)\
**Post date:** [November 3, 2023, 11:23am UTC](https://community.weweb.io/t/the-navigation-menu-on-the-bottom-of-the-page-isnt-being-correctly-displayed-in-safari-google-chrome/5188/2 "2023-11-03T11:23:08Z")

</div>

Hi @DENjnly 👋

Can you show us how things are setup in the WeWeb Editor?

It will help us better understand what may be causing the issue.

For example, it would help to see:

- what style properties you used to display it at the bottom,
- if there are padding or margins on the container,
- if you used the bottom bar provided in the toolkit or built your own, etc.

---

<div class="post-metadata">

**Author:** ![Zacharyb](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/zacharyb/32/3567_2.png) [@Zacharyb](https://community.weweb.io/u/Zacharyb)\
**Post date:** [November 4, 2023, 11:48pm UTC](https://community.weweb.io/t/the-navigation-menu-on-the-bottom-of-the-page-isnt-being-correctly-displayed-in-safari-google-chrome/5188/3 "2023-11-04T23:48:53Z")

</div>

Hello from a UX perspective in my opinion it isn’t the best navigation system for mobile browser since the browser header is often dynamic and be on bottom with an on scroll hidding  
Unless for PWA mobile don’t think it’s an ideal option

---

<div class="post-metadata">

**Author:** ![Zacharyb](https://sea2.discourse-cdn.com/flex016/user_avatar/community.weweb.io/zacharyb/32/3567_2.png) [@Zacharyb](https://community.weweb.io/u/Zacharyb)\
**Post date:** [November 5, 2023, 12:06am UTC](https://community.weweb.io/t/the-navigation-menu-on-the-bottom-of-the-page-isnt-being-correctly-displayed-in-safari-google-chrome/5188/4 "2023-11-05T00:06:51Z")

</div>

When safari is used on mobile and that the search bar is in the bottom it become hard to use with simple solution  
Also a side menu is often the best solution for mobile browser experience  
Don’t have in mind any website with a good mobile experience with a bottom bar  
( beside native apps ofc)