CSS inactif lors d'un déploiement J2E tomcat

**Jaythor** · 13/01/2017, 11h46

Bonjour,

je dois faire une appli web en j2e j'utilise un serveur tomcat et j'ai dev le projet sous eclipse.

j'ai effectué un déploiement de mon application sur un serveur tomcat avec WinSCP

J'ai un petit problème de CSS étant un novice dans cette technologie j'ai besoin d'aide s'il vous plait.

Le CSS ne s'excute pas de la même façon en local que sur le serveur sur lequel l'appli est déployée, pourtant j'ai utilisé le même navigateur à savoir i.e. 11 (contrainte de l'entreprise)

voici le formulaire en local :

Nom : affichage1.png
Affichages : 100
Taille : 32,6 Ko

Nom : affichage1.png
Affichages : 100
Taille : 32,6 Ko

Voici le même formulaire une fois déployé :

Nom : affichage2.png
Affichages : 108
Taille : 30,7 Ko

voici le fichier css (souyez indulgents

) :

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
#monForm
{
	width: 1200px;
	margin-right: 30%;
}
 
#monForm p
{
	margin: 2px 0;
}
 
#monForm fieldset
{
	margin-bottom: 10px;
	border: #7a7a7a 1px solid;
}
 
 
#monForm div
{
	float: left;
	margin-left: 20%;
}
 
#monForm fieldset legend
{
	padding: 0 10px;
	border-left: #7a7a7a 1px solid;
	border-right: #7a7a7a 1px solid;
	font-size: 1.2em;
	color: #7a7a7a;
}
 
 
#monForm label
{
	width: 40%;
	float: left;
	padding-right: 1%;
	text-align: left;
}
 
h1
{
	font-size: 50px;
	text-align: center;
	color: #FF3C3D;
}
 
#monForm input[type=text]
{
	color: black;
	width: 200px;
	border: #CCC 1px solid; 
	background-color: #FFFFFF;
}
 
#monForm input:hover, #monForm input:focus
{
	border: #999 1px solid;
	background-color: #DDEEFF; 
}
 
#monForm input[type="submit"]
{
	border: #DDEEFF 1px solid;
	width: 30%;
	height: 30px;
	margin-right: 20px;
}
 
#monForm input[type="submit"]:hover
{
	color : white;
	background-color: #FF3C3D;
	cursor: pointer;
}
 
#monForm input[type="reset"]
{
	border: #DDEEFF 1px solid;
	width: 30%;
	height: 30px;
}
 
#monForm input[type="reset"]:hover
{
	color : white;
	background-color: #FF3C3D;
	cursor: pointer;
}
 
#donnees
{
	width: 500px;
 
}
 
#donnees fieldset
{
	margin-right: 2%;
}
 
#fiel fieldset
{
	margin-bottom: 55px;
}
 
#pds label
{
	margin-bottom: 83px;
}
 
img
{
	margin-left: 480px;
}

et le code jsp :

Code html :

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
<html>
	<head>
		<meta charset="utf-8">
		<title>Applicatif Transport</title>
		<link rel="stylesheet" type="text/css" href="/Transport/inc/style.css">
	</head>
	<body>
		<div>
			<img src="inc/camion.png" alt="applicatif transport">
		</div>
		<form id="monForm" action="transport" method="post">
			<div id="donnees">
				<fieldset id="fiel">
					<legend>Données</legend>
					<fieldset>
						<legend>Usine de Départ</legend>
						<input type="radio" name="factory" value="usine 1" <c:if test='${param.factory == "usine1"}'>checked</c:if> />usine 1<br>
						<input type="radio" name="factory" value="usine 2" <c:if test='${param.factory == "usine2"}'>checked</c:if> />usine 2<br>
						<input type="radio" name="factory" value="usine 3" <c:if test='${param.factory == "usine3"}'>checked</c:if> />usine 3<br>
						<input type="radio" name="factory" value="usine 4" <c:if test='${param.factory == "usine4"}'>checked</c:if> />usine 4<br>
						<input type="radio" name="factory" value="usine 5" <c:if test='${param.factory == "usine5"}'>checked</c:if> />usine 5<br>
						<input type="radio" name="factory" value="usine 6" <c:if test='${param.factory == "usine6"}'>checked</c:if> />usine 6<br>
					</fieldset>
					<p>
						<label for="dep">Département de livraison</label>
						<input type="text" id="dep" name="departement" value="<c:out value="${departement}"/>" />
					</p>
					<p id="pds">
						<label for="kg">Poids de l'envoi en kg </label>
						<input type="text" id="kg" name="poids" value="<c:out value="${poids}"/>" />
					</p>
				</fieldset>
			<p><input type="submit" name="envoyer" value="Calculer"/> <input type="reset" name="new" value="Nouveau"/></p>
			</div>
				<fieldset id="fiel">
					<legend>Messagerie / Affrêtement</legend>
					<p>
						<label for="tr1">Transporteur</label>
						<input type="text" id="tr1" name="messagerie" value="<c:out value="${messagerie}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="c1">Code</label>
						<input type="text" id="c1" name="messCode" value="<c:out value="${messCode}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="dl1">Délai de livraison</label>
						<input type="text" id="dl1" name="dlm" value="<c:out value="${dlm}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="pv1">Prix de Vente</label>
						<input type="text" id="pv1" name="prm" value="<c:out value="${prm}"/>" disabled="disabled"/>
					</p>
				</fieldset>
				<fieldset>
					<legend>Express</legend>
					<p>
						<label for="tr2">Transporteur</label>
						<input type="text" id="tr2" name="express" value="<c:out value="${express}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="c2">Code</label>
						<input type="text" id="c2" name="expCode" value="<c:out value="${expCode}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="dl2">Délai de livraison</label>
						<input type="text" id="dl2" name="dle" value="<c:out value="${dle}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="pv2">Prix de Vente</label>
						<input type="text" id="pv2" name="pre" value="<c:out value="${pre}"/>" disabled="disabled"/>
					</p>
				</fieldset>			
				<fieldset>
					<legend>TNT Jet</legend>
					<p>
						<label for="dl3">Délai de livraison</label>
						<input type="text" id="dl3" name="dlt" value="<c:out value="${dlt}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="c3">Code</label>
						<input type="text" id="c3" name="tntCode" value="<c:out value="${tntCode}"/>" disabled="disabled"/>
					</p>
					<p>
						<label for="pv3">Prix de Vente</label>
						<input type="text" id="pv3" name="prt" value="<c:out value="${prt}"/>" disabled="disabled"/>
					</p>
				</fieldset>
		</form>
	</body>
</html>

je savais pas si je devais faire un post ici ou sur le forum j2e, étant donné que c'est un problème CSS je me suis dit qu'il sera mieux ici.

Si vous avez bseoin de plus d'infos n'hésitez pas

Merci,

**Jaythor** · 13/01/2017, 13h45

voilà problème réglé j'ai ajouté la ligne ci-dessous dans les meta données de la jsp.

Code :

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

<meta http-equiv="X-UA-Compatible" content="IE=11"/>

**NoSmoking** · 14/01/2017, 08h03

Bonjour,
perso je pense que l'on ne devrait pas avoir recours à cette <meta> tant que la page n'est pas conforme.

Manque un <!DOCTYPE..> au document
Duplication des ID dans le code
...

Markup Validation Service

CSS inactif lors d'un déploiement J2E tomcat

CSS

Discussions similaires

Partager

Partager