Alinhamento de formulario jsf

Front-end
#1

Galera tenho um simples formulário feito em JSF e quero alinhar ele no centro mais não consigo alguem pode ajudar

pesquisei e encontrei tópicos no qual tem que usar css tb e isso mesmo ?

o problema e que estou começando a usar JSF agora.

<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<html 
<head>
	<title>Login</title>
</head>
	<body>	
		<f:view>
			<h:form>
				<h:panelGrid columns="2" >
						<h:outputLabel value="Login" for="login" />
						<h:inputText id="login" value="#{agenda.Login}" />
						<h:outputLabel value="Senha" for="senha" />
						<h:inputSecret id="password" value="#{agenda.Senha}" />			
				</h:panelGrid>
					<h:commandButton value="Login" action="#{agenda.validateLogin}" />
			</h:form>
		</f:view>
	</body>
</html>
#2

sim vc deve usar css

no panelGrid vc pode usar

style=“aqui vc define…” -> style=“text-align: center;”

ou

styleClass=“alguma classe do arquivo.css” -> styleClass=“minhaClasse”
.arquivo.css {
text-align: center;
}

#3

gui_sv achei mais fácil usar o que segue abaixo que vc passou mais não funcionou,

o outro tenho que ter o arquivo css não e ?

<h:panelGrid columns="2" style="text-align: center">
#4

defina um tamanho para o panelGrid

e tente entao colocar o style no output e no input tbm

#5

então fiz mais não esta funcionando esta correto ?

<%@ taglib prefix="h" uri="http://java.sun.com/jsf/html"%>
<%@ taglib prefix="f" uri="http://java.sun.com/jsf/core"%>
<html> 
<head>
	<title>Login</title>
</head>
	<body>	
	<f:view>
		<h:form>
		<h:messages/>
			<h:panelGrid columns="2" style="text-align: center">
				<h:outputLabel value="Login" for="login" style="text-align: center"/>
				<h:inputText id="login" value=""style="text-align: center" />  
				<h:outputLabel value="Senha" for="senha" style="text-align: center" />
				<h:inputSecret id="senha" value="" style="text-align: center"" />			
				</h:panelGrid>
				<h:commandButton value="Login" action="" />
			</h:form>
		</f:view>
	</body>
</html>
#6

Você pode usar css nas colunas usando um atributo chamado, collumnClasses, e se não me engano depois que terminar o style=“text-align: center;” precisa por ;

[]`s

#7

utilize o form dentro de:
<center>
</center>

#8