css - Bootstrap navbar not visible in IE8 -
i know question has been asked several times , checked through possible solutions none worked me.
here problem: using bootstrap 3.2 , have created navbar working in chrome, firefox , latest ie not in ie8,7. tried adding following files didnt help:
<!--[if lt ie 9]> <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script> <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script> <![endif]-->
other that, tried adding: filter: none !important;
, removed .collapse{display:none}
after playing these things got menu in vertical position rather horizontal. here 2 images showing dropdown menu before , after hacks tried.
ie8
ie11
after removing .collapse{display:none}
here code:
<div class="navbar navbar-inverse"> <div class="navbar-collapse collapse navbar-responsive-collapse"> <ul class="nav navbar-nav"> <li class="active"> <a href="<%=request.getcontextpath()%>/modules/home/homepage.jsp"> <span class="glyphicon glyphicon-home"></span> </a> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">tipologie mandrini</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/tipologiemandrini/new/viewnewcontent.jsp"> <span class="glyphicon glyphicon-pencil"></span> inserersi nuovo modello</a></li> <li><a href="<%=request.getcontextpath()%>/modules/tipologiemandrini/ricerca/viewricerca.jsp"> <span class="glyphicon glyphicon-search"></span> ricerca</a></li> <li><a href="<%=request.getcontextpath()%>/modules/tipologiemandrini/view/viewhomecontent.jsp"> <span class="glyphicon glyphicon-list"></span> visita</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">singoli mandrini</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/singolimandrini/new/viewnewcontent.jsp"> <span class="glyphicon glyphicon-pencil"></span> inserersi nuovo mandrini</a></li> <li><a href="<%=request.getcontextpath()%>/modules/singolimandrini/ricerca/viewricerca.jsp"> <span class="glyphicon glyphicon-search"></span> ricerca</a></li> <li><a href="<%=request.getcontextpath()%>/modules/singolimandrini/view/viewhomecontent.jsp"> <span class="glyphicon glyphicon-list"></span> visita</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">macchine</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/macchine/new/viewnewcontent.jsp"> <span class="glyphicon glyphicon-pencil"></span> inserersi nuovo macchina</a></li> <li><a href="<%=request.getcontextpath()%>/modules/macchine/ricerca/viewricerca.jsp"> <span class="glyphicon glyphicon-search"></span> ricerca</a></li> <li><a href="<%=request.getcontextpath()%>/modules/macchine/view/viewhomecontent.jsp"> <span class="glyphicon glyphicon-list"></span> visita</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">montaggio</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/montaggio/new/viewnewcontent.jsp"> <span class="glyphicon glyphicon-pencil"></span> inserersi nuovo montaggio</a></li> <li><a href="<%=request.getcontextpath()%>/modules/montaggio/ricerca/viewricerca.jsp"> <span class="glyphicon glyphicon-search"></span> ricerca</a></li> <li><a href="<%=request.getcontextpath()%>/modules/montaggio/view/viewhomecontent.jsp"> <span class="glyphicon glyphicon-list"></span> visita</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">smontaggio</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/smontaggio/new/viewnewcontent.jsp"> <span class="glyphicon glyphicon-pencil"></span> inserersi nuovo smontaggio</a></li> <li><a href="<%=request.getcontextpath()%>/modules/smontaggio/ricerca/viewricerca.jsp"> <span class="glyphicon glyphicon-search"></span> ricerca</a></li> <li><a href="#"> <span class="glyphicon glyphicon-list"></span> visita</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">skf sf riparazione</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/skfsfrepair/new/viewnewcontent.jsp"> <span class="glyphicon glyphicon-pencil"></span> inserersi riparazione</a></li> <li><a href="#"> <span class="glyphicon glyphicon-search"></span> ricerca</a></li> <li><a href="#"> <span class="glyphicon glyphicon-list"></span> visita</a></li> <li class="dropdown-submenu"> <a href="#">ship</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/skfsfrepair/ship/new/viewnewcontent.jsp">ship cassino</a></li> </ul> </li> <li class="dropdown-submenu"> <a href="#">accept</a> <ul class="dropdown-menu"> <li><a href="<%=request.getcontextpath()%>/modules/skfsfrepair/accept/viewacceptcontent.jsp">accept spindle(s)</a></li> </ul> </li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown">altro fornitore</a> <ul class="dropdown-menu"> <li><a href="#"> <span class="glyphicon glyphicon-pencil"></span> inserersi altro fornitore</a></li> <li><a href="#"> <span class="glyphicon glyphicon-search"></span> ricerca</a></li> <li><a href="#"> <span class="glyphicon glyphicon-list"></span> visita</a></li> </ul> </li> </ul> </div> </div>
note: using yeti theme provided here: http://bootswatch.com/yeti/
i believe there answer problem on here: ie8 issue twitter bootstrap 3.
it appears respond.js works local files. referenced stackoverflow article mentions tring website on ie8 local copy of bootstrap.css. hope helps.
Comments
Post a Comment