One reason I thought I'd try this template is the cool top overflow effect of the mainmenu. Yet as I'm wrapping up my work, I see it looks different across browsers. Chrome shows it as I believe it is intended to look, with about 30px top overlap. Firefox and Microsoft IE push the menu down and don't allow overflow. So it's got to be some kind of weird Z index issue. I am having a really hard debugging it. What overflow and Z index tweaks to which blocks need to be made for the other browsers? They are interpreting the code much more strictly than Chrome. It is strictly a code issue because I have top slider module margins and padding turned off. Thanks to anyone who can help us achieve uniform rendering of the menu. Go to https://milwaukee-yacht-club.com/. Here is the current operative code which works just in Chrome. It's pretty much the stock code which came with template, except for addition of sticky positioning.
/template.css line 1972/
.t3-mainnav .t3-navbar {
background: linear-gradient(#084296, #bcc6d4);
-webkit-box-shadow: 4px 4px 10px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 4px 4px 10px 0px rgba(0,0,0,0.75);
box-shadow: 4px 4px 10px 0px rgba(0,0,0,0.75);
margin-top: 5px;
}
/custom sticky menu positioning/
.t3-mainnav {
position: sticky !important;
position: -webkit-sticky !important;
top: 35px !important;
display: block;
z-index: 25;
margin-bottom: 20px;
margin-top: -30px;
}
/template.css line 1886; overlap mainmenu/
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
margin-top: -5px;
}
-Jim Gribble
