# Problems Ios Side Menu

**URL:** <https://forum.ionicframework.com/t/problems-ios-side-menu/19362>\
**Category:** ionic-v1\
**Created:** [March 19, 2015, 10:37am UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362 "2015-03-19T10:37:26Z")\
**Posts on this page:** 13\
**Page:** 1

<div class="post-metadata">

**Author:** ![namirsab](https://avatars.discourse-cdn.com/v4/letter/n/7feea3/32.png) [@namirsab](https://forum.ionicframework.com/u/namirsab)\
**Post date:** [March 19, 2015, 10:37am UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/1 "2015-03-19T10:37:26Z")

</div>

Hello Everyobody,  
I’m using Ionic rc.1. When i see the app with Ionic View in iOS, the side menu is like in top of the content, and is almost impossible to open it. In Android everything is Ok and in the browser as well.  
Is there any known issue about this?

###EDIT:  
This is exactly what’s happening:

 ![image](https://global.discourse-cdn.com/ionicframework/original/2X/1/1ca1c5f4263d3cafb89636f02df3205ea2532fdb.png)

Look, the nav header is pushed down.  
This is how it should look, (and how it looks in android and the browser)

 ![image](https://global.discourse-cdn.com/ionicframework/original/2X/c/c28de2d4c299521a8beac7e95a7529f7e7e978ef.png)

Thanks in advance.

---

<div class="post-metadata">

**Author:** ![drodrigo](https://avatars.discourse-cdn.com/v4/letter/d/34f0e0/32.png) [@drodrigo](https://forum.ionicframework.com/u/drodrigo)\
**Post date:** [March 19, 2015, 12:48pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/2 "2015-03-19T12:48:06Z")

</div>

Could you provide a codepen ? (or simply some code)

Thanks!

---

<div class="post-metadata">

**Author:** ![namirsab](https://avatars.discourse-cdn.com/v4/letter/n/7feea3/32.png) [@namirsab](https://forum.ionicframework.com/u/namirsab)\
**Post date:** [March 19, 2015, 1:02pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/3 "2015-03-19T13:02:30Z")

</div>

Yes. here you have:  
##index.html

```
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no, width=device-width">
    <title></title>

    <!-- compiled css output -->
    <link href="css/ionic.app.css" rel="stylesheet">

    <!-- ionic/angularjs js -->
    <script src="lib/ionic/js/ionic.bundle.js"></script>
    <script src="lib/angular-resource/angular-resource.min.js"></script>

    <!-- cordova script (this will be a 404 during development) -->
    <script src="lib/ngCordova/dist/ng-cordova.js"></script>
    <script src="cordova.js"></script>

    <!-- your app's js -->
    <script src="js/app.js"></script>
    <script src="js/controllers.js"></script>
    <script src="js/utils.js"></script>
    <script src="js/services.js"></script>
  </head>

  <body ng-app="app">
    <ion-header-bar class="bar-stable">
      <img class="title-image-left" src="img/banner_left.png" /><img class="title-image-middle" src="img/banner_middle.png" /><img class="title-image-right" src="img/banner_right.png" />
    </ion-header-bar>
    <ion-nav-view class="has-header"></ion-nav-view>
  </body>
</html>

```

##Menu.html

```
<ion-side-menus enable-menu-with-back-views="false">
  <ion-side-menu-content class="has-subheader">
    <ion-nav-bar class="bar-stable bar-header">
      <ion-nav-buttons side="left">
        <button class="button button-icon button-clear ion-navicon" menu-toggle="left">
        </button>
      </ion-nav-buttons>
    </ion-nav-bar>
    <ion-nav-view name="menuContent"></ion-nav-view>
  </ion-side-menu-content>
  <ion-side-menu side="left">
    <ion-header-bar class="bar-stable">
      <h1 class="title">Menú</h1>
    </ion-header-bar>
    <ion-content>
      <ion-list>
        <ion-item item-type="item-icon-left" nav-clear menu-close href="#/app/comentarios">
	       <i class="icon ion-chatbubbles positive"></i>
         Comentarios
        </ion-item>
        <ion-item item-type="item-icon-left" nav-clear menu-close href="#" ng-click="compartir()">
         <i class="icon ion-android-share positive"></i>
         Compartir
        </ion-item>

        <ion-item item-type="item-icon-left" nav-clear menu-close href="#/app/informacion">
          <i class="icon ion-information-circled positive"></i> Informacion
        </ion-item>
        <ion-item item-type="item-icon-left"nav-clear menu-close href="#/app/notificaciones">
          <i class="icon ion-radio-waves positive"></i> Notificaciones
        </ion-item>
        <ion-item item-type="item-icon-left" nav-clear menu-close href="#/app/sponsors">
          <i class="icon ion-person-stalker positive"></i> Sponsors
        </ion-item>
        <ion-item item-type="item-icon-left"nav-clear menu-close href="#" ng-click="salir()">
          <i class="icon ion-log-out positive"></i> Salir
        </ion-item>

      </ion-list>
    </ion-content>
  </ion-side-menu>
</ion-side-menus>

```

Hope it helps…  
It’s really weird this, normally all the issues I had were with Android, not with iOS ☹

---

<div class="post-metadata">

**Author:** ![drodrigo](https://avatars.discourse-cdn.com/v4/letter/d/34f0e0/32.png) [@drodrigo](https://forum.ionicframework.com/u/drodrigo)\
**Post date:** [March 19, 2015, 1:36pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/4 "2015-03-19T13:36:43Z")

</div>

Weird, I didn’t see anything wrong with the code, it’s hard to tell what’s wrong since I can’t replicate the bug myself. Did you use ionic start myApp sidemenu (on getting started)? I use it myself and never had problems.

---

<div class="post-metadata">

**Author:** ![namirsab](https://avatars.discourse-cdn.com/v4/letter/n/7feea3/32.png) [@namirsab](https://forum.ionicframework.com/u/namirsab)\
**Post date:** [March 19, 2015, 1:39pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/5 "2015-03-19T13:39:00Z")

</div>

I used sidemenu start because it’s a side menu.  
It’s like the menu is behind the main content and like the main content is pushed down… but I dont know why… f\*ck…

---

<div class="post-metadata">

**Author:** ![drodrigo](https://avatars.discourse-cdn.com/v4/letter/d/34f0e0/32.png) [@drodrigo](https://forum.ionicframework.com/u/drodrigo)\
**Post date:** [March 19, 2015, 1:42pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/6 "2015-03-19T13:42:15Z")

</div>

I’m sorry I meant sidemenu like you said, Is your app open source? Can I take a look?

---

<div class="post-metadata">

**Author:** ![namirsab](https://avatars.discourse-cdn.com/v4/letter/n/7feea3/32.png) [@namirsab](https://forum.ionicframework.com/u/namirsab)\
**Post date:** [March 19, 2015, 1:48pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/7 "2015-03-19T13:48:12Z")

</div>

Sorry is not open source… But i can share some snippets with you…  
Ask me whatever you think it could be. I’m triying with the default sideMenu and always is perfect. This is a extrange thing,  
I’m going to try to replicate the problem in this new app to see what happens

thanks

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [March 19, 2015, 1:53pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/8 "2015-03-19T13:53:20Z")

</div>

Could you put together an example in a codepen that is similar to what you have setup?

---

<div class="post-metadata">

**Author:** ![namirsab](https://avatars.discourse-cdn.com/v4/letter/n/7feea3/32.png) [@namirsab](https://forum.ionicframework.com/u/namirsab)\
**Post date:** [March 19, 2015, 2:11pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/9 "2015-03-19T14:11:54Z")

</div>

here you have more or less what i have:  
go to the card page with the menu and you’ll see more or less my layout:

> **[gbZMpq](https://codepen.io/namirsab/pen/gbZMpq)**
>
> Forked from \[Captain Anonymous\](http://codepen.io/anon/)'s Pen \[jEXrPP\](http://codepen.io/anon/pen/jEXrPP/)....

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [March 19, 2015, 2:45pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/10 "2015-03-19T14:45:03Z")

</div>

Hmm, the codepen doesn’t seem to be having the issue.

 ![image](https://global.discourse-cdn.com/ionicframework/original/2X/3/3d455751ae344ecf6993c2bb9b7d5a06dc85e27c.png)

---

<div class="post-metadata">

**Author:** ![namirsab](https://avatars.discourse-cdn.com/v4/letter/n/7feea3/32.png) [@namirsab](https://forum.ionicframework.com/u/namirsab)\
**Post date:** [March 19, 2015, 2:48pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/11 "2015-03-19T14:48:04Z")

</div>

Yes, the issue only happens in iOS… (through the Ionic View app)  
##Edit:  
Look at the first post, the images.

---

<div class="post-metadata">

**Author:** ![mhartington](https://sea1.discourse-cdn.com/ionicframework/user_avatar/forum.ionicframework.com/mhartington/32/137757_2.png) [@mhartington](https://forum.ionicframework.com/u/mhartington)\
**Post date:** [March 19, 2015, 2:58pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/12 "2015-03-19T14:58:32Z")

</div>

![image](https://global.discourse-cdn.com/ionicframework/original/2X/a/a2472e1fec8c1545c00c5c9306f0d8e281645bba.PNG)

Still not seeing it, and this was on ios inside the ionic-view app.  
Maybe there some custom css that is causing the issue?

---

<div class="post-metadata">

**Author:** ![namirsab](https://avatars.discourse-cdn.com/v4/letter/n/7feea3/32.png) [@namirsab](https://forum.ionicframework.com/u/namirsab)\
**Post date:** [March 19, 2015, 3:20pm UTC](https://forum.ionicframework.com/t/problems-ios-side-menu/19362/13 "2015-03-19T15:20:27Z")

</div>

I have dissabled all the css classes i have and it is still happening… ☹  
It’s like there’s something between the fixed bar and the navigation bar, a white space…
