Bonjour,

J'essaie actuellement de faire un petit popup dynamique, qui s'étend avec le titre, et je cherche a faire un séparateur de la largeur du popup.
Chose faite sous FF, marche nickel... alors quoi me direz vous ? Et bien IE bien sûr !

Sous IE, pas de séparateur. Si quelqu'un pouvait m'aider, merci.

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
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html40/strict.dtd">
<html>
 
	<head>
		<link type="text/css" href="style.css" rel="stylesheet" media="screen" />
		<script type="text/javascript" src="functions.js" ></script>
	</head>
 
	<body>
 
		<div class="div1" >
 
			<div class="div2" >
				<h3>
					<div class="tableauInvisible">
						<span id="menuTitle">
							Popup Title
						</span>
						<span>
							<a><img style="padding-left:10px" src="close.png"></a>
						</span>
					</div>
				</h3>
				<ul>
					<li id="viewMode" >Menu1</li>
					<li id="editMode" >Menu 2</li>
					<hr id="separator" ></hr>
					<li id="editMode" >Menu3...</li>
				</ul>
			</div>
 
		</div>
 
	</body>
 
</html>

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
 
h3 {
	font-size: 10px;
	background-color: #6600CC;
	border-top:1px solid #564b47;
	border-bottom:1px solid #564b47;
	padding: 3px 3px 3px 3px;
	margin:0px;
	color: black;
}
 
h3 label {
	float: left;
	text-transform: none;
	color: #000000;
}
 
h3 img {
	padding-left: 10px;
	width: 10px;
}
 
.tableauInvisible table, .tableauInvisible tr, .tableauInvisible td, .tableauInvisible caption {
	width:100%;
	min-width: 30px;
	border-color:white;
	border-style:none;
	border-width:0px;
	background:none;
	font-size: 90%;
}
 
.div1{
	padding: 0px;
	width: 100%;
	height: 100%;
	text-align: center;
}
 
.div2{
	position: absolute;
	width: auto;
	border: 1px solid black;
	background: #6666CC;
	font-size: 9px;
	font-family: Verdana,Arial,SunSans-Regular,Sans-Serif;
	text-align: left;
	color: white;
}
 
.div2 ul li{
	width:auto;
	padding: 3px 3px 3px 3px;
	height:10px;
}
 
.div2 li:hover{
	color:black;
}
 
dl, dt, dd, ul, li, hr {
	margin: 0;
	padding: 0;
	list-style-type: none;
}
 
 
#separator {
	background-color: black;
	width: auto;
	padding: 0;
	height: 1px;
}
 
#separator:hover {}
J'ai essayé pas mal de trucs, et j'avoue être à court d'idée... ah si tout le monde pouvait être sous FF
Mais comme c'est loin d'être le cas, je m'en remets à vous.

Merci et bonne journée

EDIT : Pour le close.png mettez n'importe quoi ou virez le, désolé.