Probleme d'affichage d'une <div>

Version imprimable

09/08/2010, 15h33
jlau89

Probleme d'affichage d'une <div>

Bonjour

Je voulais savoir si mon problème était deja arrivé a quelqu'un :

j'ai une page html/asp contenant des <div> (non imbriquées, seulement pour faire une menu, un corps et une en-tete),

lorsque j'accede a ma page, une div n'apparait plus (celle du corps), alors que si j'affiche le code source de la page avec ie>click droit>afficher la source (je suis obligé de bosser sous ie), le code source de cette div y est bel et bien.

en gros le code source est bien rempli avec la div correspondante, mais ie ne l'affiche pas

à quoi cela peut il etre du?

merci
09/08/2010, 16h22
RomainVALERI

Citation:

Envoyé par jlau89

à quoi cela peut il etre du?

merci

A beaucoup de choses :mrgreen:

>>> ton HTML*, ton CSS, ton JS, en premier lieu ^^

montre-nous les parties probantes pour un avis circonstancié :)

* le HTML généré, pas ton code ASP qui ne nous sert pas à grand chose

bon alors voici mon code html généré :

en gros j'ai une barre laterale ou je peux choisir soit un logiciel directement, soit une categorie de logiciel... lorsque que j'affiche la page initialement, j'ai une liste avec quelques renseignements sur le logiciel (nom, version editeur et description) , avec mes différentes parties de la page.

lorsque je selectionne un logiciel dans ma barre latérale, la page du logiciel s'ouvre dans le div "corps" (via un iframe)

lorsque je selectionne une categorie de logiciel, la il m'affiche une page dans la barre lattérale, pour selectionner le logiciel parmi ceux du theme, mais je voudrais qu'il y ait aussi la liste de tous les logiciels dans le div "corps" (comme quand j'ouvre la page initialement), et c'est dans ce cas la que mon code source bien qu'existant n'apparait pas sur la page... c'est peut etre du a mon javascript ?

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
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Liste des logiciels</title>
<link rel="stylesheet" href="style.css" type="text/css" media="screen" />
 
<SCRIPT language="JavaScript"> 
	function Lien() {
		i = document.choix.logiciel.selectedIndex;
		if (i == 0) return;
		url = "http://srvweb/applications/exercices/stagiaire/logiciels/liste_logiciels.asp?logiciel=" + document.choix.logiciel.options[i].value;
		parent.location.href = url;
	}
 
	function Lien2() {
		j = document.choix.theme_logiciel.selectedIndex;
		if (j == 0) return;
		url = "http://srvweb/applications/exercices/stagiaire/logiciels/liste_logiciels.asp?theme_logiciel=" + document.choix.theme_logiciel.options[j].value;
		parent.location.href = url;
	}
</SCRIPT>
 
</head>
<body id="page_blanche">
 
<div id="en_tete">
### plein de liens ####
</div>
 
 
<div id="menu">
	<form name="choix" method="post" action="">
		<br/><br/>
		Il y a actuellement 168 logiciels.<br/><br/>
		<br/>
		Nom du logiciel :<br/><br/>
 
		<select name="logiciel" onChange="Lien(this.form)">
 
			<option value=""></option>
 
 
			<option value="113">ACCESS 2007</option>
 
 
			<option value="69">ADOBE ACROBAT</option>
 
			##### plein d'options ######
 
			<option value="110">WORD 2007</option>
 
 
		</select>
 
 
 
		<br/><br/>
		Thème du logiciel :<br/><br/>
		<select name="theme_logiciel" onChange="Lien2(this.form)">
 
			<option value=""></option>
 
			<option value="Administratif">Administratif</option>
 
			<option value="Base de données">Base de données</option>
 
                                            ##### plein d'options ######
 
 
			<option value="Unités">Unités</option>
 
 
		</select>
		<br/><br/>
	</form>
 
 
		<IFRAME src="liste_logiciels_par_theme.asp?theme_logiciel=Bureautique" frameBorder="0" scrolling="no" width="250px" height="25%"/>
 
</div>
 
 
#### voici la div qui ne s'affiche pas : #####
<div id="corps">
 
		<table border="1px" border frame="void">
		  	<tr>
				<td id="tete_tableau">Nom du logiciel : </td>
				<td id="tete_tableau">Version du logiciel : </td>
				<td id="tete_tableau">Description : </td>
				<td id="tete_tableau">Éditeur : </td>
			<tr/>
 
				<tr>
					<td><a href="liste_logiciels.asp?logiciel=113">ACCESS 2007</a></td>
					<td>2007</td>
					<td>Gestion des bases de données.</td>
					<td>Socotec</td>
				<tr/>
 
							<tr>
					<td><a href="liste_logiciels.asp?logiciel=69">ADOBE ACROBAT</a></td>
					<td>9.0</td>
					<td>Logiciel qui permet d'imprimer dans un fichier électronique (.PDF) comme sur une feuille papier.</td>
					<td>Acrobat</td>
				<tr/>
 
			##### plein de lignes du tableau ######
 
 
				<tr>
					<td><a href="liste_logiciels.asp?logiciel=110">WORD 2007</a></td>
					<td>2007</td>
					<td>Logiciel de traitement de texte</td>
					<td>Microsoft</td>
				<tr/>
 
		</table>
 
 
</div>
 
</body>
</html>

10/08/2010, 11h43
RomainVALERI

A vue de nez, rien de très frappant pour le moment... :?

...dans style.css peut-être ?

y'a un peu de tout la dedans, surtout que je viens de le modifier pour faire un menu déroulant, mais normalement je n'ai pas touché grand chose a ce qui nous intéresse, donc voici style.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
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
 
body
{
background-color:#ffffff;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
size:1em;
}
 
#page_blanche
{
background-color:white;
font-family:Arial, Helvetica, sans-serif;
size:1em;
}
 
h1
{
color:white;
font-weight:bold;
size:1.5em;
background-color:#808080;
}
 
h2
{
color:white;
font-weight:bold;
size:1.3em;
background-color:#808080;
}
 
a
{
color:rgb(255,160,66);
font-weight:bold;
}
 
a:hover
{
color:rgb(80,100,200);
font-weight:bold;
background-color:rgb(215,215,215);
}
 
td
{
padding-left: 10px;
}
 
 
#souligne
{
text-decoration:underline;
font-weight:bold;
}
 
#gras
{
font-weight:bold;
text-align:right;
}
 
 
#italique
{
font-style:italic;
}
 
 
#case_centree_couleur
{
text-align: center;
background-color:#FFCC99;
}
 
 
table
{
background-color:#e5e8ea;
color : #1877d5;
}
 
#tete_tableau
{
color: white;
font-weight:bold;
background-color:#808080;
}
 
 
#en_tete
{
   width: 100%;
   margin-bottom: 10px; 
   margin-top:3px;
   margin-left:3px;
   padding-bottom: 5px;
   position:top; 
   background-color:#3490b6; /* bleu */
   border-width:2px;
   border-style:solid;
   border-color:#297eb5;
   text-align: center;
 
}
 
#corps
{
   width:100%;
   text-align: justify;
   border-width:5px;
   border-style:solid;
   border-color:#b3b5b7;
   background-color: #e5e8ea;/* gris*/
   height:100%;
   text-align:center;
   padding:0px;
}
 
#menu
{   margin-left: 3px; 
   margin-right: 10px;
   float: left;  Le menu flottera à gauche */
   width: 300px; 
   height:100%;
   background-color:#bbdaea;
   border-width:2px;
   border-style:solid;
   border-color:#3fabcc;
   font-weight:bold;
}
 
#menu select 
{
	font-family : verdana;
	font-size : 10px;
	color : #000000;
	width:250px; 
 
}
 
#en_tete table
{
background-color:#3390b6;
width:100%;
 
}
 
 
 
body 
{ 
	behavior: url(csshover.htc); 
} 
 
/* definit la taille de la div du menu2 ainsi que la taille de parties du menu2*/ 
 
div#menu2 
{ 
	text-align:center;
	color: white;
	font-weight: bold;
	float:right;
 
} 
 
div#menu2 ul 
{ 
 
	margin:5px; 
 
} 
 
 
 
/*On positionne les elements du menu2 */ 
div#menu2 ul li 
{ 
	position:relative; 
	list-style: none; /*on enleve les icones de liste */ 
	border-bottom:1px solid; /*ajout d'une bordure de separation d'element:*/ 
	/float: left;
	width:220px;
	height:50px;
	background-color:#3490b6; /*couleur du menu2*/
	padding-top:8px;
} 
 
 
 
div#menu2 ul ul 
{ 
	position: absolute; 
	/* top: -1px; 
	left: 100px; */
	display:none; 
	width:220px
}   
 
 
div#menu2 li a 
{ 
text-decoration: none; 
padding: 0;
 display:block; 
 /*border-left: 8px solid #BBB; */
 width:100px}
} 
 
 
 
/* On cache tous les sous menu2 avec la propriété display none */ 
div#menu2 ul ul 
{ 
	position: absolute; 
	top: 45px; 
	left: -5px; 
	display:none;
	width:220px;
} 
 
 
div#menu2 ul li ul li
{ 
	width: 220px;
	background-color:#b1b1b1 ;
	padding-top:0px;
	padding-bottom:0px;
} 
 
/*Lors du survol ,avec la souris, les sousmenu apparaissent grace a display: block */ 
div#menu2 ul.niveau1 li.sousmenu:hover ul.niveau2
{ 
	display:block; 
}
 
 
div#menu2 a
{ 
	color:white ;
	font-weight:bold;
} 
 
/* fond different au survol de la souris entre les sous-menu et les "basiques"*/ 
div#menu2 li:hover 
{ 
	background: #EDD ;
} 
 
div#menu2 ul li.sousmenu:hover 
{ 
	background: #19bdff 
} 
 
 
div#menu2 ul.niveau2 li:hover 
{ 
	background: #b5c4d2; 
} 
 
 
 
div#menu2 li a 
{ 
	text-decoration: none; 
	display:block; 
	border-left: 
	8px solid #BBB; 
	width: 220px ;
	height:100%
} 
 
/* la bordure de chaque hauteur a une couleur de survol */
div#menu2 li a:hover 
{ 
	border-left-color: #00a0e0; 
}

10/08/2010, 14h35
jlau89

c'est bon j'ai trouvé

en fait j'utilise des iframes, mais je n'utilisais pas de balise fermantes :

je faisais <iframe ##### /> (comme un input ou un br) alors qu'il faut faire <iframe ### >:cry:</iframe>

merci en tout cas
10/08/2010, 22h27
RomainVALERI

Ah ? tiens :mrgreen: pas vu effectivement...

...je t'avouerais aussi que je n'utilise jamais d'iframe... ^^ du coup je n'étais probablement pas la personne la plus à même de repérer le problème :aie:

m'enfin bon, comme tu as fini par trouver... :ccool: