Pessoal,
Gostaria de centralizar o “Enviar” conforme a imagem em anexo. Alguem pode me ajudar ??
segue abaixo meu codigo :
<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE composition PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns:ui="http://java.sun.com/jsf/facelets"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
template="../template/Template.xhtml">
<ui:define name="header">
</ui:define>
<ui:define name="subheader">
</ui:define>
<ui:define name="indexLeftColumn">
</ui:define>
<ui:define name="indexRightColumn">
<h:form>
<p:panel style="left:100px; width:400px;height:200px;">
<f:facet name="header">
<h:outputText value="#{msg.login_titulo}" />
</f:facet>
<h:panelGrid columns="3" styleClass="center-table" style="text-align:right;">
<h:outputText value="#{msg.login_usuario_login}:" />
<p:inputText id="#{msg.login_usuario_login}" value="" />
<p:message for="#{msg.login_usuario_login}" styleClass="mensagem-validacao" />
<h:outputText value="#{msg.login_usuario_senha}:" />
<p:password value=""
required="true" id="#{msg.login_usuario_senha}" label="#{msg.login_usuario_senha}" />
<p:message for="#{msg.login_usuario_senha}" styleClass="mensagem-validacao" />
<p:commandButton value="Enviar" style="height: 30px; width: 100px; horizontal-align:center;"/>
</h:panelGrid>
</p:panel>
</h:form>
</ui:define>
</ui:composition>
Bom dia a Todos
<p:commandButton value="Enviar" style="height: 30px; width: 100px; text-align:center;"/>
já tentou o text-align?
O segredo está no alinhamento do <h:panelGrid>
[code] <h:panelGrid columns=“3” styleClass=“center-table” style=“text-align:right;”>
<h:outputText value="#{msg.login_usuario_login}:" />
<p:inputText id="#{msg.login_usuario_login}" value="" />
<p:message for="#{msg.login_usuario_login}" styleClass="mensagem-validacao" />
<h:outputText value="#{msg.login_usuario_senha}:" />
<p:password value="" required="true" id="#{msg.login_usuario_senha}" label="#{msg.login_usuario_senha}" />
<p:message for="#{msg.login_usuario_senha}" styleClass="mensagem-validacao" />
</h:panelGrid>
<h:panelGrid columns="1" styleClass="center-table" style="text-align:right;">
<p:commandButton value="Enviar" style="height: 30px; width: 100px; horizontal-align:center;"/>
</h:panelGrid> [/code]
tentei dessa forma que vc me falou
<p:commandButton id="btnEnviar" value="Enviar" style="height: 30px; width: 100px; text-align:center;" actionListener="#{TabprodMbean.verificausuario()}"/>
mas nao deu certo…teria que alinhar horizontamente .
ninvit
#5
Você pode resolver assim…
No seu .css adicione
.centralizar {text-align: center;}
e use onde quiser
<div class="centralizar">
aqui tem um site bom de css
www.maujor.com
tentei dessa forma
<h:panelGrid columns="3" styleClass="center-table" style="text-align:right;">
<p:commandButton action="#{tblusuMbean.verificausuario}" style="height: 30px; width: 80px; text-align:center; horizontal-align:center;" value="Enviar" update="@form"/>
<h:outputText value="" />
<p:commandButton action="#{tblusuMbean.limpar}" value="Limpar" update="@form"/>
</h:panelGrid>
mas ele nao fica alinhado de acordo com o tamanho do botao
Alguem pode me ajudar ??
Tentou da forma como falei?
Tente um p:outputPanel no lugar do h:panelGrid
<p:outputPanel style="width: 100%; text-align:center" layout="block">
<p:commandButton value="Enviar" style="height: 30px; width: 100px"/>
</p:outputPanel>
1 curtida
Cara nao deu certo , fiz assim , mas nao rolou
<p:outputPanel style="width: 100%; text-align:center" layout="block">
<p:commandButton value="Enviar" style="height: 20px; width: 100px"/>
</p:outputPanel>
da uma olhada na imagem
Voce quer centralizar o botao ou o texto do botao ?
O texto no caso seria “Enviar”
Retire o style
<p:commandButton value="Enviar"/>
mas como vou diminuir a altura do botao e deixar o Texto "Enviar " centralizado ??
assim:
<h:form>
<p:panel style="width:300px;">
<f:facet name="header">
<h:outputText value="Autenticação" />
</f:facet>
<h:panelGrid columns="3" style="text-align:left;">
<h:outputText value="Login:" />
<p:inputText id="login" value="" />
<p:message for="login" />
<h:outputText value="Senha:" />
<p:password value="" required="true" id="senha" label="Senha:" />
<p:message for="senha" />
</h:panelGrid>
<div align="center">
<p:commandButton value="Enviar" style="height: 30px; font-size: 12px"/>
</div>
</p:panel>
</h:form>
Basta voce diminuir o tamanho da fonte do texto do botao.
cara quero agradecer pela dica, deu certo …faz dias que estava me matando …vlw mesmo …abc
ah! desculpe, achei que tu queria pôr o botão no meio.
Já tive um problema parecido e tive que diminuir a fonte.