Why z-index does not working in ios iphone (6)?

Question

I'm trying to up the menu layer using z-index. Its working on chrome, FireFox, I.E, Safari and other small screens (Android Mobiles). But it doesn't work in iphone 6 safari browser. Following are the my code.

CSS

.main-menu-nav ul.custom-dropdown li {
    z-index: 10000;
    background: #e7058c;
    border-bottom: 1px solid #F97DC7;
}
.nav>li {
    position: relative;
    display: block;
}

HTML

<ul class="nav navbar-nav custom-dropdown">
    <li class=""><a href="#">special</a></li>
</ul>

I searched about it and find a well explained answer, i tried this but does not working. Can any one guide me how can fix this issue.

This will help, http://stackoverflow.com/questions/16033416/while-scrolling-on-an-ios-device-the-z-index-of-elements-isnt-working — Deepanshu Mishra, Jan 31 '16 at 11:37
@DeepanshuMishra I already mentioned in my question, i followed this answer but it it does not working. — Ayaz Ali Shah, Jan 31 '16 at 11:38

score 0 · Answer 1 · edited Dec 13 '16 at 12:12

0

You may use transform: matrix3d(); instead on z-index

Where you can set "X" "Y" "Z" axis of an object.

edited Dec 13 '16 at 12:12

FelixSFD

6,052
10
43
117

answered Dec 13 '16 at 12:09

Asm Hijas

77
4

Why z-index does not working in ios iphone (6)?

CSS

HTML

1 Answers1