Menu
I'm using:
I am trying put p:menu to website:
<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns:p="http://primefaces.org/ui"
xmlns:h="http://java.sun.com/jsf/html"
>
<body>
<ui:composition>
<h:form>
<p:menu >
<p:submenu label="TESTING" icon="ui-icon-disk">
<p:menuitem value="TEST" outcome="/jsp/home" icon="ui-icon-star"/>
<p:menuitem value="List" outcome="/jsp/rip/home2" />
<p:menuitem value="ExcelTEst" outcome="/jsp/excelTest" />
</p:submenu>
</p:menu>
</h:form>
</ui:composition>
</body>
</html>
In this example icon ui-icon-star jumps to submenu Testing left upper coner. Also this happens for all icons, which I add for menuitems. As for icon ui-icon-disk, it doesn't show up.
I tried several other examples. This worked:
<p:panelMenu style="width:200px">
<p:submenu label="Navigations" >
<p:submenu label="Links" icon="ui-icon-extlink">
<p:submenu label="PrimeFaces" icon="ui-icon-heart">
<p:menuitem value="Home" url="http://www.primefaces.org" icon="ui-icon-home" />
<p:menuitem value="Docs" url="http://www.primefaces.org/documentation.html" icon="ui-icon-document" />
<p:menuitem value="Download" url="http://www.primefaces.org/downloads.html" icon="ui-icon-arrowthick-1-s" />
<p:menuitem value="Support" url="http://www.primefaces.org/support.html" icon="ui-icon-wrench" />
</p:submenu>
</p:submenu>
<p:menuitem value="Mobile" icon="ui-icon-signal"/>
</p:submenu>
</p:panelMenu>
Can someone say, what's wrong? Why p:menu doesn't work as expected?
474
That's not the right solution, just fix in your custom theme css:
.ui-menu .ui-icon
position: absolute; /* remove this line */
top: .2em;
left: .2em;
}
to
.ui-menu .ui-icon
top: .2em;
left: .2em;
}
157
answered Dec 03 '25 21:12
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With