Aller au contenu

Chevauchement des <div> sous IE

Dhamma

Par Dhamma
dans (X)HTML et CSS

 Partager

Sujets conseillés

Dan

Dan

Posté
Posté

Bonjour,

Dans la mesure où tu utilises un positionnement absolu et un z-index différent pour chaque <div>, c'est très simple ;)

<style type="text/css">
div#a {position absolute;width:200px; height:200px;top:200px;left:200px;z-index:10 }
div#b {position absolute;width:200px; height:200px;top:250px;left:250px;z-index:15 }
</style>

A toi d'ajuster le padding de la <div> qui est en-dessous ;)

Lien vers le commentaire
Partager sur d’autres sites
Alonnka

Alonnka

Posté
Posté (modifié)

J'ai fais ça :


<!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" lang="fr">
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
margin: 0;
padding: 0;
}
#conteneur {
width:250px;
}
#menu {
margin-top:10px;
width:55px;
height:100%;
float:left;
padding:10px;
background-color:#FF00FF;
}
#bloc {
padding-top:10px;
margin-left:40px;
padding-left:40px;
background-color:#FFFF00;
}
</style>
</head>

<body>
<div id="conteneur">
 <div id="menu">
  Item 1<br />
  Item 2<br />
  Item 3<br />
 </div>
 <div id="bloc">
  Texte Texte<br />
  Texte Texte<br />
  Texte Texte<br />
  Texte Texte<br />
  Texte Texte<br />
  Texte Texte<br />
  Texte Texte<br />
 </div>
</div>
</body>
</html>

Je ne sais pas si c'est ce que tu veux mais si c'est le cas ben... Bonne chance pour régler le problème de decalage sous IE :).

Après relecture je pense que c'est justement ce problème pour lequel tu cherches une solution... Ben je la cherche aussi alors :).

Modifié par Alonnka
Lien vers le commentaire
Partager sur d’autres sites
Dhamma

Dhamma

Posté
  • Auteur
Posté (modifié)

Merci beaucoup ! Je n'arrivais même pas à faire chevaucher les <div>. Pour le problème de décalage du texte, je viens de trouver la solution. :)

Il suffit d'ajouter ceci dans le code html :

<!--[if IE]>
<style type="text/css">
<!--
#menu {position: absolute;}
-->
</style>
<![endif]-->

Modifié par Dhamma
Lien vers le commentaire
Partager sur d’autres sites
Dan

Dan

Posté
Posté
Il suffit d'ajouter ceci dans le code html :

<style type="text/css">
<!--
#menu {position: absolute;}
-->
</style>

Et j'ai mis quoi dans l'exemple que je te donne ? :whistling:

La différence est que je n'ai pas appelé la <div> "menu" mais "a" et "b" ...

Lien vers le commentaire
Partager sur d’autres sites
Dhamma

Dhamma

Posté
  • Auteur
Posté (modifié)
Et j'ai mis quoi dans l'exemple que je te donne ? :whistling:

Il était aussi question de "position: absolute", si c'est ce que vous insinuez, mais le fait est que le chevauchement ne fonctionnait pas du tout, ni sur IE, ni même sur FF.

Il fallait aussi mettre ma "citation" en entier, avec "<!--[if IE]>", car c'est justement ça qui fait toute la différence.

Merci quand même d'avoir pris le temps de m'aider ;)

Modifié par Dhamma
Lien vers le commentaire
Partager sur d’autres sites

Veuillez vous connecter pour commenter

Vous pourrez laisser un commentaire après vous êtes connecté.



Connectez-vous maintenant
 Partager
Aller sur la liste des sujets
×
×
  • Créer...