- General
-
Bugs
HTML5 and Bootstrap Dropdown Menu Layering Issue
Hi, all.
I have a sample published here:
https://rtgstorecentus01.blob.core.windows.net/content/sandbox/bootstrap-4-menu.html
The page uses the Bootstrap toolkit. If you click on the dropdown menu in the menubar, you'll notice that it falls behind the avatar. It doesn't do this with the Flash version. Is it possible to alter the layering somehow so that the SitePal player is lower on the z-axis?
The above sample uses the current version of Bootstrap 4.0, which technically is still in beta. This issue also appears in the most recent production version of Bootstrap, version 3.3.7:
https://rtgstorecentus01.blob.core.windows.net/content/sandbox/bootstrap-337-menu.html
Thanks much!
--Alex. :-)
Answer
Quick and accurate response. Much appreciated, Gil!
Alex -
We've assigned "z-index: 9999;" to our SitePal player so that it would not be hidden behind other HTML elements.
You should be able to resolve by assigning a larger z-index to the dropdown.
We've verified this will work in your case - please see the following screenshots -
Hope this helps.
Best
Gil
Perfect - Thanks, Gil!
For those of you reading this after the fact, you can find corrected versions here:
- https://rtgstorecentus01.blob.core.windows.net/content/sandbox/bootstrap-4-menu-fixed.html
- https://rtgstorecentus01.blob.core.windows.net/content/sandbox/bootstrap-337-menu-fixed.html
You'll note that you'll probably want to alter the z-index for .tooltip, too, as done in the embedded stylesheet for the two files linked above.
Thanks again!
Customer support service by UserEcho
Alex -
We've assigned "z-index: 9999;" to our SitePal player so that it would not be hidden behind other HTML elements.
You should be able to resolve by assigning a larger z-index to the dropdown.
We've verified this will work in your case - please see the following screenshots -
http://prntscr.com/hcwqgk
http://prntscr.com/hcwpxm
Hope this helps.
Best
Gil