28173 sujets

CSS et mise en forme, CSS3

Problème de positionnement absolu sous IE

Bonjour,
j'ai un problème de rendu sous IE avec ce code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html  xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<link rel="stylesheet" type="text/css" href="screen.css" />
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<title>no title</title>
</head>
<body>
<div id="main">
	<div id="hmenu">

	</div><!-- hmenu -->
	<div id="logo">&nbsp;</div>
	<div id="quicklauch">
		
	</div>
	<div id="content">
		
	</div>
</div>
</body>
</html>

et la css associée :

#main
{
	position: absolute;
	left: 5%;
	right: 5%;
}
#hmenu
{
	position: absolute;
	right: 250px;
	left: 0;
	height: 250px;
}
#logo
{
	position: absolute;
	right: 0;
	height: 250px;
	width: 250px;
	background: url(logo.png);
}
#content
{
	position: absolute;
	top: 250px;
	right: 250px;
	left: 0;
}
#quicklauch
{
	position: absolute;
	right: 0;
	top: 250px;
	width: 250px;
}

Le résultat est conforme à mes attentes sous Firefos mais il est catastrophique sous IE (testez-le vous même).
Je n'y comprends vraiment rien Smiley decu
Merci de votre aide Smiley cligne
Salut !
Tu devrais te pencher sur la propriété css "float" qui permet de faire sortir un élément du flux(float:right, par exemple).
Evite aussi le positionnement absolu si ce n'est pas necessaire.
Modifié par Ralfman68 (07 Apr 2006 - 23:41)
Essai ca

CSS

#main
{
	left: 5%;
	right: 5%;
}
#hmenu
{
	height: 250px;
}
#logo
{
	height: 250px;
	width: 250px;
	float: right;
}
#content
{

}
#quicklauch
{
	width: 250px;
	float: right;
}


HTML

<div id="main">
	<div id="hmenu">
	     <img id="logo" src="logo.png" alt="" />
	     Le menu
        </div>
	<div id="quicklauch">lien rapide</div>
	<div id="content">Contenus</div>
</div>


A+
Le problème est simple, tu contredit la position de ta tag div #main, tu lui donne un left et un right, enlève simplement la position left.
Sujet clos
Aller à