1 pièce(s) jointe(s)
Mise en page formulaire du login
Bonjour,
Je me lance dans javaee / jsf et j'ai une question de mise en page.
Dans l'image transmise, j'ai 2 points obscurs :
1. Pourquoi y'a-t-il un espace entre mes composants et le bord du panelGrid, sur la droite ?
2. Comment est-ce que je peux centrer le bouton "Connexion" ?
Voici ma page :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
| <?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:h="http://java.sun.com/jsf/html"
xmlns:p="http://primefaces.org/ui"
xmlns:f="http://java.sun.com/jsf/core"
xmlns:ui="http://java.sun.com/jsf/facelets">
<f:view locale="#{changeLocale.locale}">
<h:head>
<title>Connexion</title>
<h:outputStylesheet library="css" name="styles.css" />
</h:head>
<body>
<h:form id="connexionForm">
<p:growl id="growl" life="2000" />
<p:panelGrid columns="1" style="margin-bottom:10px" layout="grid">
<f:facet name="header">
<h:outputText class="titreLogin" value="Connexion" />
</f:facet>
<h:outputText value="Nom d'utilisateur :" />
<p:inputText id="login" value="#{loginForm.login}" />
<h:outputText value="Mot de passe :" />
<p:password id="password" value="#{loginForm.password}" />
<p:panelGrid columns="2" style="margin-bottom:15px" styleClass="panelSansBordure">
<p:selectBooleanCheckbox value="#{loginForm.isRemembered}" />
<h:outputText value="Se souvenir de moi" />
</p:panelGrid>
<p:commandButton value="Connexion" id="doLogin" update="growl" actionListener="loginForm.anthenticate}" styleClass="ui-priority-primary" />
</p:panelGrid>
<p:commandLink id="forgetLogin" update="growl"
actionListener="#{loginForm.forgetLoginData}">
<h:outputText class="lien" value="Login ou mon mot de passe oublié" />
</p:commandLink>
</h:form>
</body>
</f:view>
</html> |
Et la feuille de style :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
| /*
Document : style
Created on : 30.03.2015
Author : auth
Description:
Purpose of the stylesheet follows.
*/
/* Formulaires */
#formulaire {
position:absolute;
top:50%;
left:50%;
width:1400px;
height:1000px;
margin-left:-700px; /* -largeur/2 */
margin-top:-500px; /* -hauteur/2 */
background:red;
}
#connexionForm {
position: absolute;
top: 50%;
left: 50%;
width: 350px;
height: 200px;
margin-left: -175px; /* -largeur/2 */
margin-top: -100px; /* -hauteur/2 */
/*background: red;*/
font-color: #82b4ec;
}
/* Panel */
.panelSansBordure tr, .panelSansBordure td {
border: none;
}
/* Tableau */
.columnCenter {
text-align: center;
}
.titreLogin {
font-size: 25px;
font-weight: bold;
text-align: right;
}
.lien {
font-size: 14px;
text-decoration: none;
} |
Qqun a-t-il réponse à mes questions ?
Merci d'avance pour votre aide
Pièce jointe 173125
