how to create layer in html view (or increase z index of layer )?

could you please tell me why my menu option come below the scrolling view ?

Actually I have one menu button on my screen when I open menu option on click of menu button .It show menu option and scroll my contend my scroll contend display above the menu option

enter image description here http://plnkr.co/edit/G8mp53rQlF562hEkgmgT?p=preview

Menu option should come above the scrolling contend ? I already increase z index..But not work ? 

    .nav_bar {
    background: #597A4D!important;
    border-style: none;
    height: 44px;
    border: 0px!important;
    border-radius: 0px!important;
    z-index:99999;

}

Got The solution my own

Anwser plunker

.nav_bar {
    background: #597A4D!important;
    border-style: none;
    height: 44px;
    border: 0px!important;
    border-radius: 0px!important;
    z-index:99999;

}

The menu bar appears behind the scrolling container because both the containers are at the same stack order. Specifying z-index will give menu elements greater stack order.

Add z-index to list item.

.nav>li
{
    z-index: 1;
}

What Samir is trying to say is very simple, z-index implies the priority of how elements will be displayed in your browser. which means, if you apply 

.nav->li
{
   z-index: 1;
}

the element will have the higher priority then the other elements. By defining z-index you are defining priority for your element's display, this way, avoiding situations as described in the question above.

there is no limit that I know of for defining z-index.