Primefaces menubar style is broken on IE 8
Question
I have a simple menuBar in my application and works very nice on chrome and firefox. But, when I tested with IE 8, the style of menubar is broken. I think is just style because the links are working fine. Below, a screenshot of my menu on IE 8:
And my menubar code:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui">
<ui:composition>
<h:form id="menuForm">
<p:menubar id="appMenu">
<p:menuitem value="Celulares" url="#{menuMB.toMeusCelularesIndex()}" rendered="#{p:ifAnyGranted('USER')}" />
<p:submenu label="Celulares (Admin)" rendered="#{p:ifAnyGranted('ADMIN')}">
<p:menuitem value="Titulares" url="#{menuMB.toCelularTitularIndex()}" rendered="#{p:ifAnyGranted('ADMIN')}" />
<p:menuitem value="Agregados" url="#{menuMB.toCelularAgregadoIndex()}" rendered="#{p:ifAnyGranted('ADMIN')}" />
</p:submenu>
<p:submenu label="Faturas" rendered="#{p:ifAnyGranted('ADMIN')}">
<p:menuitem value="Titulares" url="#{menuMB.toFaturaTitularIndex()}" rendered="#{p:ifAnyGranted('ADMIN')}" />
<p:menuitem value="Agregados" url="#{menuMB.toFaturaAgregadoIndex()}" rendered="#{p:ifAnyGranted('ADMIN')}" />
</p:submenu>
<p:submenu label="Sistema" rendered="#{p:ifAnyGranted('ADMIN')}">
<p:menuitem value="Forçar Login" url="#{menuMB.toForcarLogin()}" rendered="#{p:ifAnyGranted('ADMIN')}"/>
<p:menuitem value="Fazer Checkup" url="#" rendered="#{p:ifAnyGranted('ADMIN')}" />
<p:menuitem value="Administradores" url="#{menuMB.toAdministradores()}" rendered="#{p:ifAnyGranted('ADMIN')}" />
<p:menuitem value="Parâmetros do Sistema" url="#{menuMB.toParametrosIndex()}" rendered="#{p:ifAnyGranted('ADMIN')}" />
</p:submenu>
<p:menuitem value="Sair" url="#{menuMB.toLogout()}" rendered="#{p:ifAnyGranted('USER')}" />
</p:menubar>
</h:form>
</ui:composition>
</html>
I accessed the menubar showcase , and it works on IE 8. I can only imagine that I've made some mistake on my code. I am currently using:
- Primefaces 4.0,
- MyFaces 2.1.12
- Tomcat 7.0.42.
If you need more information, please let me know.
1 answers
solution1
1 ACCPTED 2013-10-24 13:37:11
Check your developer tools in IE8 when you open your website where style broken and Primefaces showcase and check for document mode and browser mode in two cases.See you find any differences when you load two websites. Check out these links to know more about this behavior
This link tells how to force IE8 to open in the mode which does not break your CSS programmatically by specifying in your XHTML file
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.