Bonjour, j'ai un bug CSS qui n'intervient que sous IE.

J'ai un div conteneur placé en position relative. À l'intérieur, j'ai du contenu ainsi qu'un autre div en absolute qui doit occuper toute la hauteur de ce bloc avec une largeur fixe.
L'effet est basique, mais ne fonctionne pas avec IE qui se met à faire n'importe quoi dès que height est en poucentage.

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
<?xml version="1.0" encoding="iso-8859-1"?>
<!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" xml:lang="fr">
	<head>
		<title>Test</title>
		<style type="text/css">
			div#conteneur{
				position:relative;
				width:50%;
				background-color:#000;
			}
			div#conteneur div.extra_div{
				position:absolute;
				top:0;
				left:0;
				width:30px;
				height:100%;
				background:#900;
			}
			p{
				color:#fff;
				margin-left:30px;
			}
 
		</style>
	</head>
	<body>
		<div id="conteneur">
			<p>
				Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
			</p>
			<div class="extra_div"></div>
		</div>
	</body>
</html>

Ca m'étonne, mais je n'ai trouvé aucun sujet nulle part en traitant.