JSP et CSS: problème de taille de caractères

Bonjour,

j'ai une page "login" qui inclus une CSS; cette page lorsqu'elle est submitée revoie vers une page "layout" qui inclus toutes les autres pages et la même CSS. Ma page login est bien formatée avec le css mais lorsque on arrive sur la page layout la CSS n'est pas prise en compte pour la taille des caratères (il remet la taille ar défaut) :marteau:
Si je vire la page de login tout fonctionne bien.

Login.jsp

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
53
54
 
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@ taglib uri="/WEB-INF/struts-html.tld" prefix="html" %>
 
<html>
    <head>
        <script language="JavaScript">
              window.history.forward();
              document.onselectstart=new Function ("return false");
              document.oncontextmenu=new Function ("return false");
              function setHidden(value){document.formulaire.hidden.value=value};
        </script>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link type="text/css" rel="stylesheet" href="<%=request.getContextPath()%>/css/co2.css">
    </head>
    <body onunload="window.history.forward();" onselectstart="return false;" oncontextmenu="return false;">
        <html:form action="/login" focus="username">
            <html:hidden property="hidden" value="logon"/>
            <table height="600" width="800">
                <tr height="200">
                    <td align="center">
                        <h1>Service</h1>
                    </td>
                </tr>
                <tr height="400" valign="top">
                    <td align="center">
                        <table class="login">
                            <tr height="10"><td> </td></tr>
                            <tr height="20">
                                <td class="logincell" align="right">Nom d'utilisateur</td>
                                <td>
                                    <html:text property="username" size="20"/>
                                </td>
                            </tr>
                            <tr height="20">
                                <td class="logincell" align="right">Mot de passe</td>
                                <td>
                                    <html:password property="password" size="22"/>
                                </td>   
                            </tr>
                            <tr height="20">
                                <td colspan="2" align="center">
                                    <html:submit>Démarrer</html:submit>
                                </td>   
                            </tr>
                            <tr height="10"><td> </td></tr>
                        </table>
                    </td>
                </tr>
            </table>
        </html:form>
    </body>
</html>

Layout.jsp

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
 
<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
 
<html>
    <head>
        <script language="JavaScript">
              window.history.forward();
              document.onselectstart=new Function ("return false");
              document.oncontextmenu=new Function ("return false");              
        </script>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link type="text/css" rel="stylesheet" href="<%=request.getContextPath()%>/css/co2.css">
    </head>
    <body onunload="window.history.forward();" onselectstart="return false;" oncontextmenu="return false;">
        <table width="800">
            <tr>
                <td align="center" colspan="2" class="bgcolor1"><img src="image/banner.png" border="0"></td>
            </tr>
            <tr height="500" valign="top">
                <td width="150" class="bgcolor1" valign="top"><jsp:include page="/jsp/common/Menu.jsp" flush="false"/></td>
                <td width="650">
                    <table  width="100%"><tr><td>
                                <% 
                                String pageRedir = (String)request.getAttribute("pageredirection");
                                if(pageRedir == null || "".equals(pageRedir)){ %>
                                <jsp:include page="../notification/NotificationList.jsp" flush="false"/>
                                <%} else{ %>
                                <jsp:include page="<%=pageRedir%>" flush="false"/>
                                <% } %>
                        </td></tr>                               
                    </table>
                </td>
            </tr>        
        </table>
    </body>
</html>

CSS

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
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
 
* 
{
        margin:             0;
        padding:            0;
}
 
BODY
{ 
        font-size:          8pt;
	font-family:        verdana,helvetica,arial,"lucida sans",sans-seriff;
	background-color:   #ffffe4; 
}
 
.divHideShow
{
        border-width:       3px;
	border-spacing:     0px;
	border-style:       solid;
	border-color:       #009966;
	border-collapse:    collapse;
        width:              649px;  
        margin:             5px;
        background-color:   #009966;
}
 
.h4rem
{
        FONT-WEIGHT:        bold; 
        margin-bottom:      2px;
}
 
 
/* Used for the <display:table> ******************************************** */
 
th 
{
	padding:            2px 4px 2px 4px ;
	text-align:         left;
	vertical-align:     center;
        height:             20px;
}
 
 
thead tr 
{
	background-color:   #00CC99;
}
 
th a,th a:visited, th a:hover 
{
	color:              black;
        text-decoration:    none;
}
 
th.sorted a,th.sortable a 
{
	background-position: right;
	display:            block;
	width:              100%;
}
 
th.sortable a 
{
	background-image:   url(../image/arrow_off.png);
        background-repeat:  no-repeat;
}
 
th.order1 a 
{
	background-image:   url(../image/arrow_down.png);
        background-repeat:  no-repeat;
}
 
th.order2 a 
{
	background-image:   url(../image/arrow_up.png);
        background-repeat:  no-repeat;
}
 
tr a
{
    	text-decoration:    none;
	color:              black;
        display:            block;
        width:              100%;
        height:             100%;
}
 
tr.trSelected
{
        background-color:   #00CC99;
        cursor:             hand; 
        color:              yellow;
}
 
tr.odd 
{
	background-color:   #99ff99;
        height:             20px;
        vertical-align:     center;
}
 
tr.tableRowEven,tr.even {
	background-color:   #88ff77;
        height:             20px;
        vertical-align:     center;
}
 
span{
        display:            none;
}
 
/* ************************************************************************* */
 
tr.trLight, tr.trDark, tr.trSelected 
{
	font-weight:        normal;
  	text-align:         left;
	vertical-align:     top;
}
 
tr.trLight { background-color: #99ff99; }
tr.trDark { background-color: #88ff77; }
 
 
td.tdLabelCell
{
	font-weight:        600;
        text-align:         left;	
	white-space:        pre;
        padding:            3px;
	vertical-align:     middle;
}
td.tdCell
{
	color:              black; 
	font-weight:        normal;
        text-align:         left;	
	white-space:        nowrap;
	vertical-align:     middle;
	letter-spacing:     -1px;
        padding:            3px;
}
 
 
/* Used for the left menu ************************************************** */
 
.popper 
{ 
        POSITION:           absolute; 
        VISIBILITY:         hidden; 
        z-index:            0; 
        left:               130px;
}
 
#topgauche 
{ 
        position:           absolute;  
        z-index:            0; 
}
a:hover.ejsmenu 
{
        color:              white; 
        text-decoration:    none;
}
.ejsmenu 
{
        color:              white; 
        text-decoration:    none;   
}
a.ejsmenu 
{
        color:              white; 
        text-decoration:    none;    
        display:            inline;
}
 
/* ************************************************************************* */
 
.bgcolor1
{
        background-color:   #40a080;
}
 
.bgcolor2
{
        background-color:   #99ff99;
}
a.hideshow
{
        background-color:   transparent;
        display:            inline;
 
}
 
table.detail
{
        width:              100%;
        font-size:          8pt;
}
 
input.protectedData, input.unProtectedData
{
 
        border:             0px;
	padding-right:      1pt;
	padding-left:       1pt;
}
 
input.protectedData
{
        background-color :  transparent; 
}
 
.login
{
        background-image:   url(../image/login.png);
        background-repeat:  no-repeat;
        width:              400px;
        height:             200px;
        font-size:          8pt;
        font-weight:        bold;
}
td.logincell
{
        padding-right:      25;
}

Est ce que quelqu'un à une idée?

Merci

personne n'a une idée?:(

Salut,

Sa serait pas un problème de chemin relatif/absolue a ton fichier css.

rajoute toi un print dans tes 2 jsp afin de voir si tu pointes bien sur les mêmes chemins avec

Code:

request.getContextPath()%>/css/co2.css

et tente en rajoute le "/" au href

Code:

<link type="text/css" rel="stylesheet" href="/<%=request.getContextPath()%>/css/co2.css">

Edite le code source d'une page qui pose problème et poste le

A+

1 pièce(s) jointe(s)

voici le problème vu avec firebug
on voit bien que la taille doit être de 20 mais ce n'est pas cette taille qui est affichée. (on ne voit pas bien sur l'image mais le "font-size: 8pt;" est barré)

Pettie question si tu attaques directement es jsp sans passe par la page de login ni ton layout est ce que le css est-il bien pris en compte ?

Si c'est le cas le problème se situerait au niveau du layout

en fait avant d'intégrer la page de login tout allait bien.
donc j'avais au départ de l'appli la page de Layout qui inlus toutes les autres pages, là pas de problème, mais après j'ai mis la page de login au départ de l'appli et c'est là que les caractères changent. Le font-size du body qui est à 8pt n'est pas pris en compte, mais par exemple j'ai un font-size dans un td et là la taille est bien prise en compte.

Et si tu ecris en dure le chemin d'accès au css à la place de

Code:

request.getContextPath()%>/css/co2.css

Tu as toujours le même problème ?

ça ne change rien :(
le css est bien pris en compte car le formatage de mes autres éléments est correct, c'est juste la taille du body...

je suis à court d'idée :(

On peut reprendre à presque 0 ?
La taille que tu attends est 8 ou 20 ?
Tu peux poster le fichier html et la css qui ne fonctionnent pas, et le fichier html et la css qui fonctionnent ?

la taille que j'attend est 8 (or ici ça affiche 12). j'avais mis 20 dans table.detail pour un test.

les fichiers sont dans mon premier post.
login-->layout + css = ne fonctionne pas
layout + css = fontionne

En attendant j'ai mis un font-size dans toute mes td mais c'est vraiment pas beau!

Ce que je te demandais c'était le html généré, pas les jsps ...