Problème de Div avec IE

Fermé
Arawn94 - 22 août 2008 à 14:55
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 - 23 août 2008 à 02:32
Bonjour,

Je vous expose mon problème! Je souhaite mettre un Div devant un autre Div dans un Div contenaire.
Mon contenaire contient l'image header et les 2 autres div contiennent des images.

L'image 2 doit aussi être devant l'image 1.

Exemple code html :

<div id="contenaire" class="contenaire>
<div id="1" class="1"><img src="image1.gif"></div>
<div id="2" class="2"><img src="image2.gif"></div>
</div>

Exemple code css :

div.contenaire {
width: 500px;
height: 250px;
background: url('contenaire.gif') no-repeat;
}
div.1 {
position: relative;
text-align: center;
float:center;
padding: 160px 0px 0px 0px;
}
div.2 {
position: absolute;
float:left;
padding: 160px 0px 0px 0px;
}

Tout fonctionne à merveille sur Mozilla mais sur IE lorsque je redimensione la page avec le petit icon en haut du navigateur les 2 images des 2 div disparaissent et réaparaîssent si je réactualise la page...

Le problème vient sûrement de position relative et absolute...

Comment faire?

J'attends vos réponses avec impatience :)
A voir également:

9 réponses

PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
22 août 2008 à 16:09
En utilisant

div.d1 {
position: absolute;
z-index : 1;
}

div.d2 {
position: absolute;
z-index : 2;
}


pas de pb particulier sous IE ni FF
3
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 672
22 août 2008 à 15:03
Essaye d'y rajouter des trucs genre "top: 10px; left: 20px;"
1
Ca change rien, les div ou les images disparaîssent à chaque redimensionement sauf le header...
0
pijaku Messages postés 12263 Date d'inscription jeudi 15 mai 2008 Statut Modérateur Dernière intervention 4 janvier 2024 2 745
22 août 2008 à 15:13
Salut,
Expliquez moi à quoi servent deux attributs à une div : <div id="contenaire" class="contenaire> ?
Voir ici pour l'utilisation de ces div : https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3#ss_part_3
De plus, attention aux guillemets : <class="contenaire> ne marchera pas sans guillemet à la fin... ou fonctionnera mal.
Les mystères de IE étant impénétrables, ce n'est peut être pas la seule explication...
Bon courage.
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
J'ai réecri trop vite, dans la vrai version il ne manque pas les guillemets, même si je ne mets pas id ca bug toujours! C'est vraiment flagrant! On redimensione et les 2 images disparaissent comme apr magie...
0
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 672
22 août 2008 à 15:35
Je viens de tester chez moi avec tes css et html... tout fonctionne parfaitement.
testé avec Firefox 3.0.1 et IE 6.0
0
PhP Messages postés 1767 Date d'inscription lundi 11 décembre 2000 Statut Membre Dernière intervention 23 décembre 2009 606
22 août 2008 à 15:44
Bjr

J'avoue que je ne vois pas trop ce que tu essais de faire ...



Sinon il me semble que l'attribute float ne supporte pas la valeur center.
Ensuite soit tu utilises float soit position absolute : mais les 2 ensembles ça paraît bizarre
Si tu veux être sûr que div2 soit au-dessus de div1 donne lui un z-index supérieur

.d1
{
z-index : 1;
}


.d2
{
z-index : 2;
}

Enfin je serais toi je changerais les noms des classes 1 et 2 pour d1 ou d2 par ex
0
C'est des exemples biensûr que je ne mets pas que 1 ou 2.

Je veux rien faire il y a juste un problème de compatibilité avec IE apparement.

Mes 2 DIV du milieu disparaisse lorsque je redimenssione la page (le navigateur)...
0
meuhlol Messages postés 1896 Date d'inscription mardi 24 juillet 2007 Statut Membre Dernière intervention 30 novembre 2021 672
23 août 2008 à 02:32
j'ai essayé les deux, trois et même... ajoutant des "top, left..." cela marche pour mon vieux IE 6.0 que j'use pas et mon FF3 qui marche à merveille!

mets ton "TESTsite" online, histoire qu'on puisse voir! cela ce trouve, c'est que cela bug chez toi!
0