Fichier CSS ne s'applique pas sur la JSP

**jamalmoundir** · 02/07/2007, 15h32

Salut,
je sais pas pq ma feuille de style ne s'applique pas sur ma jsp. Voila un extrait de mon fichier CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
div#conteneurglobal
{
	border:1px solid #45843F;
	margin-right:auto;
	margin-left:auto;
	width:1024px;
	margin-top:20px;
}
 
div#finalspacer
{
	clear:both;
	width:1024px;
	background-color:#F4F4F4;
	margin-top:-1.3em;
}
 
div#haut
{
	margin:0px;
	padding:0px;
	width:1024px;
	/*position:relative;
	z-index:100;*/
}
 
div#conteneurmilieu 
{
	/*width:auto;*/
	padding:0px 0px 0px 180px;
	/*position:relative;*/
	background-color:#F4F4F4;
	float:left;
	clear:right;
	width:844px;;
}
 
/* A ENLEVER */
div#conteneurmilieularge {
	width:auto;
	border:solid white 0px;
	background-color: #FF0000; /* couleur du centre */
 
	/*/*/ border-left-width: 200px ;  /* left column width. NN4 hack to hide borders */
	border-left-color: white;   /* couleur colonne de gauche */
	border-left-style: solid;
	position:relative;
}
 
div#milieu 
{
	margin:0px;
	/*width:100%;*/
	/*position:relative;*/
	padding-bottom:30px;
	background-color:#F4F4F4;
	padding-left:20px;
	/*float:left;*/
}

ma jsp est la suivante :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
<%@ page contentType="text/html; charset=iso-8859-1" language="java" import="java.sql.*" errorPage="" %>
<!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">
 
<%@ taglib uri="/WEB-INF/c.tld" prefix="c" %>
<%@ taglib uri="/WEB-INF/taglibs-datetime.tld" prefix="dt" %>
<%@ page isELIgnored="false" %>
 
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<!-- CSS Tabs is licensed under Creative Commons Attribution-NonCommercial-ShareAlike 1.0 - http://creativecommons.org/licenses/by-nc-sa/1.0/ -->
<%@ include file="include/entete.jsp" %>
 
 
 
 
</head>
	<body>
		<div id="conteneurglobal">
			<div><a href="#" title="haut de page" id="top"></a></div>
			<h1 class="invisible">Livraisons</h1>
			<%@ include file="include/haut.jsp" %>
 
			<div id="conteneurmilieu">
				<div id="milieu">
					<div id="milieuinterieur">
						<%@ include file="include/navigation.jsp" %>
 
						<div id="consultation">
							<div id="titrecontenu">
								<h2>
									Livraisons	
								</h2>
							</div>
 
							<div id="barreprogression">
								<h3 class="invisible">Chemin de progression dans l'application</h3>
								<ul>
									<li>
										<a title="Livraisons">Livraisons</a>				
									</li>
									<li>
										<a href=''><img id='aideicone' src='images/pictos/picto_aide.gif' /></a>
									</li>
								</ul>
							</div>
 
							<div id="contenu">
								<a id="accescontenu"></a>
						    		<style type="text/css">
        
                                                                        body {
                                                                            font: 12px verdana, arial, sans-serif;
                                                                            background-color: #fff;
                                                                            margin: 50px;
                                                                        }
                                                                        
                                                                        ul#tabnav {
                                                                            font: bold 12px verdana, arial, sans-serif;
                                                                            list-style-type: none;
                                                                            padding-bottom: 24px;
                                                                            border-bottom: 1px solid #969696;
                                                                            
                                                                        }
                                                                        
                                                                        ul#tabnav li {
                                                                            float: left;
                                                                            height: 21px;
                                                                            background-color: #DDDDDD;
                                                                            margin: 2px 2px 0 2px;
                                                                            border: 1px solid #969696;
                                                                        }
                                                                        
                                                                        ul#tabnav li.active {
                                                                            border-bottom: 1px solid #fff;
                                                                            background-color: #fff;
                                                                        }
                                                                        
                                                                        ul#tabnav li.active a {
                                                                            color: #000;
                                                                        }
                                                                
                                                                        #tabnav a {
                                                                            float: left;
                                                                            display: block;
                                                                            color: #666;
                                                                            text-decoration: none;
                                                                            padding: 4px;
                                                                        }
                                                                        
                                                                        #tabnav a:hover {
                                                                            background: #fff;
                                                                        }
                                                                
                                                                </style>
									<h3>Gestion des intervenants</h3>			
									<ul id="tabnav">
									     <li class="active"><a href="acceuil.html">Liste des intervevants</a></li>
									     <li><a href="<c:url value="/edit.html?id=-1"/>">Ajout</a></li> 
								    </ul>
										 <pr>
											<table border="1" style="font-family:Verdana; font-size:12px;" >
												<tr>
													<th>Id</th>
													<th>Nom</th>
													<th>Login</th>
													<th>Mot de passe</th>
													<th>Tel</th>
													<th>Email</th>
													<th></th>
													<th></th>
												</tr>
												<c:forEach var="intervenant" items="${intervenant}">
													<tr>
														<td><c:out value="${intervenant.idIntervenant}"/></td>
														<td><c:out value="${intervenant.nomIntervenant}"/></td>
														<td><c:out value="${intervenant.loginIntervenant}"/></td>
														<td><c:out value="${intervenant.mdpIntervenant}"/></td>
														<td><c:out value="${intervenant.telIntervenant}"/></td>
														<td><c:out value="${intervenant.emailIntervenant}"/></td>
														<td><a href="<c:url value="/edit.html?id=${intervenant.idIntervenant}"/>">Modifier</a></td>
														<td><a href="<c:url value="/delete.html?id=${intervenant.idIntervenant}"/>">Supprimer</a></td>
													</tr>
												</c:forEach>
											</table>
										 </pr>
							</div> <!-- Fin du contenu -->
 
						</div> <!-- Fin de centre -->
 
					</div> <!-- Fin de milieu interieur -->
 
				</div> <!-- Fin de milieu -->
 
				<%@ include file="include/bas.jsp" %>
 
			</div>	<!-- Fin de conteneur milieu -->
 
			<div id="finalspacer"></div>
 
		</div> <!--  Fin de conteneur global -->
 
 
 
 
 
	</body></html>

et enfin ds mon fichier entete.jsp, j'ai l'appel du fichier CSS

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<LINK title="charte intranet" href="style/complet.css" type=text/css rel=stylesheet>

Merci de jeter un coup d'oueil.

ps: le fichier CSS, c'est pas moi qu'il a fait, je l'est recupere et j'essaye de me baser dessus.

**aJavaDeveloper** · 04/07/2007, 17h05

Il y a plusieurs erreurs dans ton code.
Tout d'abord, il y a une balise </head> qui traîne dans ta page principale.
Ensuite, je pense que la déclaration des taglibs que tu utilises doit se trouver au-dessus de la déclaration de ta DTD.
De plus, il manque des guillemets dans ta balise <link>.
Enfin, je vois que tu codes en XHTML.
En HTML, la balise <link> ne doit pas nécessairement être fermée, ce qui n'est pas le cas en XHTML.
Voici donc la ligne à utiliser :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<LINK title="charte intranet" href="style/complet.css" type="text/css" rel="stylesheet"/>

Si ça ne fonctionne toujours pas, assure-toi que ta balise <link> se trouve bien dans la balise <head> de ton fichier entête.
Si ça ne fonctionne toujours pas, assure-toi que le chemin d'accès à ta feuille de style CSS est correct.

**jamalmoundir** · 04/07/2007, 17h40

j'ai fais ts les points que ta dit, sans succes.
mais pour </head> il y avait bien un <head> c'est au debut du fichier.
merci quand meme

**nicolasr59** · 04/07/2007, 21h34

Bonsoir,

n'aurais tu pas un problème d'accés(url) à la feuille de style.

Essaie de mettre une url en absolue pour vérifier.

**aJavaDeveloper** · 05/07/2007, 09h20

Ca pourrait aider si tu nous montrais le début du code (au moins le contenu de la balise <head>) de la page HTML générée par ta page JSP.
Pour récupérer ce code, il te suffit de visualiser ta page JSP dans un navigateur, de faire un clic droit sur cette page et de sélectionner l'option "visualiser la source".

**jamalmoundir** · 06/07/2007, 14h48

salut,
voila le code de ma jsp

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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
 
 
 
 
 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
	<meta http-equiv="Content-Script-Type" content="text/javascript" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
 
	<link title="charte intranet" rel="stylesheet" href="styles/intranet/menu-horizontal.css" type="text/css" />
	<link title="charte intranet" rel="stylesheet" href="styles/intranet/complet1.css" type="text/css" />
 
	<!--[if IE]>
	<link title="charte intranet" rel="stylesheet" href="/styles/intranet/ie.css" type="text/css" />
	<![endif]-->
	<link title="charte intranet" rel="stylesheet" href="styles/application/application.css" type="text/css" />
 
	<link title="texte seul" rel="alternate stylesheet" href="styles/texte/texte_seul.css" type="text/css" />
 
	<link rel="icon" href="/images/favicon.ico"/>
	<script type="text/javascript" src="scripts/menu.js"> </script>
	<title>
			Page d'accueil
			 - Application de Gestion de Projet</title>
</head>
	<body>
 
		<div id="conteneurglobal">
			<div><a href="#" title="haut de page" id="top"></a></div>
			<h1 class="invisible">Application de Gestion de Projet</h1>
			<!-- Haut de la page : titre et menu -->
<!-- TODO : changer les liens du menu de .do en .jsp si aucun traitement servlet n'est nécessaire -->
 
 
 
 
 
<div id="haut">
 
		<div id="nomdusite">
 
			<div id='logodusite2'><img src='./images/Logo_Experian-Prologia.png' /></div>
				<div>
					<p id="datedujour">
 
					vendredi 6 juillet 2007
					<br/>
					11:19
				</div>
			</div>
		</div>
 
</div>
 
			<div id="conteneurmilieu">
				<div id="milieu">
					<div id="milieuinterieur">
						<!-- Navigation à l'intérieur d'une rubrique (menu à gauche) -->
 
<div id="navigation">
	<div class='menu1'>
		<h3 class="invisible">Menu contextuel</h3>
		<br/>
 
		<ul>	
			<li><p>Gestion des intervenants</p>
				<ul>
					<li><a href="edit.html" title="Directions régionales">Intervenant</a></li>
					<li><a href="delete.html" title="Responsables de vente régional">Droit d'accés</a></li>
					<li><a href="list.html" title="Zone et secteurs">Fonction</a></li>
					</ul>
 
			</li>
		</ul>
	</div>
</div>
 
 
						<div id="consultation">
							<div id="titrecontenu">
								<h2>
									Application de Gestion de Projet	
								</h2>
 
							</div>
									<h3>Gestion des intervenants</h3>			
									<ul id="tabnav">
									     <li class="active"><a href="acceuil.html">Liste des intervevants</a></li>
									     <li><a href="/AGP-Prototype/edit.html?id=-1">Ajout</a></li> 
									     <li><a href="/AGP-Prototype/index.html">Index</a></li> 
								    </ul>
										 <pr>
 
											<table border="1" style="font-family:Verdana; font-size:12px;" >
												<tr>
													<th>Id</th>
													<th>Nom</th>
													<th>Login</th>
													<th>Mot de passe</th>
													<th>Tel</th>
 
													<th>Email</th>
													<th></th>
													<th></th>
												</tr>
 
 
													<tr>
														<td>1</td>
														<td>Jamal Moundir</td>
 
														<td>jmo</td>
														<td>PROLOGIA</td>
														<td>06 34 45 65 65</td>
														<td>moundir1@gmail.com</td>
														<td><a href="/AGP-Prototype/edit.html?id=1">Modifier</a></td>
														<td><a href="/AGP-Prototype/delete.html?id=1">Supprimer</a></td>
 
													</tr>
 
													<tr>
														<td>2</td>
														<td>Chirac Jacqu</td>
														<td>cja</td>
														<td>EXPERIAN</td>
														<td>06 56 67 67 78</td>
 
														<td>cja@prologia.fr</td>
														<td><a href="/AGP-Prototype/edit.html?id=2">Modifier</a></td>
														<td><a href="/AGP-Prototype/delete.html?id=2">Supprimer</a></td>
													</tr>
 
 
											</table>
										 </pr>
							</div> <!-- Fin du contenu -->
 
 
						</div> <!-- Fin de centre -->
 
					</div> <!-- Fin de milieu interieur -->
 
				</div> <!-- Fin de milieu -->
 
				<!-- Bas de page : utilisateur + copyright -->
 
<div id="sessionID">
	<p><strong>Utilisateur : </strong>null</p>
 
	<p><a href="acceuil.html">Se déconnecter</a></p>
</div>
 
<div id="bas">
	<div class="clr"></div>
	<div id="pied">
		<h3 class="invisible">Outils du site</h3>
		<div id="outils">
			<ul>
 
				<li>Mise à jour le : 3 Juillet 2007</li>
				<li><a href="acceuil.html" accesskey="3" title="Plan du site">Plan du site</a></li>
				<li><a href="acceuil.html" accesskey="5" title="Aide générale">Aide générale</a></li>
				<li><a accesskey="7" href="mailto:webmaster@intranet.agp.fr">Message à l'éditeur</a></li>
				<li><a href="#" title="Copyright">&copy; AGP 2007</a></li>
			</ul>
 
		</div>
	</div>
</div>
 
			</div>	<!-- Fin de conteneur milieu -->
 
			<div id="finalspacer"></div>
 
		</div> <!--  Fin de conteneur global -->
 
 
 
 
 
	</body></html>

Merci

Fichier CSS ne s'applique pas sur la JSP

Servlets/JSP Java

Vue hybride

Discussions similaires

Partager

Partager