Arquivo Discussoes de Programacao e Tecnologia E ae galera,
Estou criando um template aqui com o primefaces. Estou utilizando o p:layoutUnit para dividir o layout.
O problema está que no centro eu preciso dividir a tela em MENU: 20% CONTEUDO: 80%. Quando o menu abre, ele não consegue sobrepor o centro, aí corta pela metade o menu.
Alguém tem alguma sugestão?
Abraços!
Código:
<body>
<p:layout>
<p:layoutUnit position="north" size="20%">
<p:layout>
<p:layoutUnit position="north" size="70%">
</p:layoutUnit>
<p:layoutUnit position="center">
<p:menubar styleClass="ui-widget-header">
<p:submenu label="File" icon="ui-icon-document">
<p:submenu label="New" icon="ui-icon-contact">
<p:menuitem value="Project" url="#" />
<p:menuitem value="Other" url="#" />
</p:submenu>
<p:menuitem value="Open" url="#" />
<p:separator />
<p:menuitem value="Quit" url="#" />
</p:submenu>
<p:submenu label="Edit" icon="ui-icon-pencil">
<p:menuitem value="Undo" url="#" icon="ui-icon-arrowreturnthick-1-w" />
<p:menuitem value="Redo" url="#" icon="ui-icon-arrowreturnthick-1-e" />
</p:submenu>
</p:menubar>
</p:layoutUnit>
</p:layout>
</p:layoutUnit>
<p:layoutUnit position="center">
<ui:insert name="centro">
O que estiver aqui será substituido!
</ui:insert>
</p:layoutUnit>
</p:layout>
</body>
Resolvi esse problema.
Solução:
<style type="text/css">
.ui-layout-north {
z-index:20 !important;
overflow:visible !important;;
}
.ui-layout-north .ui-layout-unit-content {
overflow:visible !important;
}
</style>
Abraços