Pb affichage conteneurs IE

Pb affichage conteneurs IE - HTML/CSS - Programmation

Marsh Posté le 20-03-2008 à 01:41:50    

Bonjour,  
j'ai un probleme d'afichage de ma page sous IE6
Cela fonctionne parfaitement sur IE7, Opera et Firefox
Mais sur IE, les conteneurs partent de tous les cotés et rien ne se tient.
L'image de background elle aussi est coupée alors que son conteneur fait sa taille exacte....
 
Voici le fichier CSS
 
 
@charset "utf-8";
/* CSS Document */
 
body {
background-color: #000000;
 
}
/* page avec image en background*/
 
html, body {
height: 100%
}
 
#page {
VISIBILITY: visible;
MARGIN-LEFT: auto;
WIDTH: 980px;
MARGIN-RIGHT: auto;
POSITION: relative;
background-color: #000000;
background-repeat: no-repeat;
background-position:center 30px;
height: 750px;
 
zoom:1;
background-image: url(images/page.jpg);
 
 
 
}
/* Box 1: menu de navigation*/
#box1 {
height: 20px;
width: 530px;
position: relative;
visibility: visible;
margin-top: 180px;
float: right;
margin-right: 70px;
background:#8F8F8F;
 
}
/* Box 2: affichage des images*/
#box2 {
height: 200px;
width: 305px;
position: relative;
visibility: visible;
margin-top: 440px;
float: left;
margin-left: 55px;
background:#8F8F8F;
}
/* Box 3: rapppel de l'adresse en gris*/
#box3 {
height: 20px;
width: 500px;
position: relative;
visibility: visible;
float: left;
margin-left:80px;
margin-top: 70px;
color: #8F8F8F;
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
background:#8F8F8F;
}
 
 
 
/* Box 5: texte*/
#box5 {
height: 360px;
width: 500px;
position: relative;
visibility: visible;
float: left;
margin-left:80px;
margin-top: 10px;
color:#000000;
font-family: "Times New Roman", Times, serif;
font-size: 12px;
background:#8F8F8F;
}
/* Box 6: pied de page*/
#box6 {
height: 20px;
width: 880px;
position: relative;
visibility: visible;
float: left;
margin-top: 10px;
margin-left: 50px;
font-family: "Times New Roman", Times, serif;
font-size: 12px;
color: #AF0D18;
font-weight: bold;
background:#8F8F8F;
}

 
 
et le fichier HTML simplifié:
 
<!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">
<head>
<title></title>
<link href="styleaccueil.css" rel="stylesheet"
type="text/css" media="screen" />
</head>
<body>
<div id="page">
<div id="box1"></div>
<div id="box2"> </div>
<div id="box3"></div>
<div id="box5"></div>
</div>
</body>
</html>

 
 
Voila si quelqu'un a une idée qui pourrait m'aider a résoudre ce problème très génant...... moi je sèche complètement... la ca dépasse mes capacités!
Merci d'avance..
Cordialement...

Reply

Marsh Posté le 20-03-2008 à 01:41:50   

Reply

Marsh Posté le 20-03-2008 à 03:00:05    

mais qu'est ce que c'est que ces styles ??
Ca à été généré par un programme ou par toi même ??
C'est quoi ce html, body '.... un simple body{.. suffit amplement.
Il manque un ";" a ta premiere définition.
C'est quoi ces position:relative; partout sans aucune utilisation de top left right bottom ? avec des float par dessus en plus...
C'est quoi ces styles en majuscules ?
C'est quoi ces visibility:visible quand on sait que par défaut c'est toujours visible ?
 
Et je me demande qui vous apprend à créer une div pour tout et n'importe quoi :D, ton menu c'est un ul > li li... >ul j'imagine. Donc à quoi te sert la div quand tu peux simplement appliquer le style à l'élément UL (ou alors ton menu à un décore super complexe et la je m'incline).
 
Un code propre et simpliste à souhait c'est la première chose à apprendre pour comprendre ce qui va et ce qui ne va pas par la suite. Parce que css c'est le style en cascade peut-être, mais surtout les problèmes en cascade si tu joues avec trop d'éléments superflus.
 
Bon je ne vois pas du tout ou tu veux en venir avec tes float right et left, tu veux que tes boites s'affichent comment ? un schéma, un screenshot, un lien ?


---------------
Studio CréeAll
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed