Layout não sobrepoe com css

Programação Java
#1

Boa noite pessoal.
Estou criando uma pagina simples para fins didáticos com JSF, e ai eu parei em um problema onde o menu principal, ao passar o mouse por cima, as subopções ficam cortadas, elas não aparecem, ai vi que dava pra arrumar com css mas mesmo assim não esta indo. poderiam me ajudar?

modeloPrincipal.xhtml <?xml version="1.0" encoding="ISO-8859-1" ?>

< !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:h=“http://java.sun.com/jsf/html”
xmlns:f=“http://java.sun.com/jsf/core”
xmlns:p=“http://primefaces.org/ui”
xmlns:ui=“http://java.sun.com/jsf/facelets”>
< h:head>
< meta http-equiv=“Content-Type” content=“text/html; charset=ISO-8859-1” />
< title>Drogaria
< h:outputStylesheet library=“css” name=“estilos.css”/>
< /h:head>
< h:body>
< p:layout fullPage=“true”>
< p:layoutUnit position=“north”>
< ui:insert name=“menu”/>
< /p:layoutUnit>

< p:layoutUnit position="center">
	< ui:insert name="conteudo"/>
< /p:layoutUnit>

< /p:layout>

< /h:body>
< /html>

O Outro arquivo é:

menuPrincipal.xhtml

<?xml version="1.0" encoding="ISO-8859-1" ?>

<ui:composition xmlns=“http://www.w3.org/1999/xhtml”
xmlns:h=“http://java.sun.com/jsf/html”
xmlns:f=“http://java.sun.com/jsf/core”
xmlns:p=“http://primefaces.org/ui”
xmlns:ui=“http://java.sun.com/jsf/facelets”>

<h:form>
	<p:menubar>
		<p:submenu label="Arquivos">
			<p:menuitem value="Sair"/>
		</p:submenu>
		
		<p:submenu label="Cadastro">
			<p:menuitem value="Fabricante"/>
			<p:menuitem value="Produto"/>
		</p:submenu>
		
		<p:submenu label="Ajuda">
			<p:menuitem value="Sobre"/>
		</p:submenu>
	</p:menubar>
</h:form>

< /ui:composition>

O outro arquivo é:

Principal.xhtml
< ?xml version=“1.0” encoding=“ISO-8859-1” ?>
< !DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
<ui:composition xmlns=“http://www.w3.org/1999/xhtml”
xmlns:ui=“http://java.sun.com/jsf/facelets”
template="/templates/modeloSistema.xhtml">

< ui:define name=“menu”>
< ui:include src="/includes/menuPrincipal.xhtml" />
< /ui:define>

< ui:define name=“conteudo”>
< /ui:define>

< /ui:composition>

E o Arquivo CSS:

.ui-layout-north {
z-index: 20 !important;
overflow: visible !important;
}

.ui-layout-north .ui-layout-unit-content {
overflow: visible !important;
}

body {
background-color: #FFFFFF;
}


A pagina fica assim:

Sem título.jpg948×362 36.9 KB