Probléme d'affichage sur internet explorer 6

Fermé
nicolas.paradise Messages postés 5 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 25 janvier 2008 - 11 janv. 2008 à 13:55
nicolas.paradise Messages postés 5 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 25 janvier 2008 - 15 janv. 2008 à 10:51
Salut à tous!
Alors voila je suis en train de réaliser benevolement un petit site en php pour une association, seulement je ne suis pas professionnel et le site que j'ai réalisé, s'il est correct sous firefox, ne l'est plus du tout si on l'ouvre dans Internet Explorer (en l'occurence ici j'ai IE 6)
Voila l'adresse provisoire de ce site www.nicolasbaechel.com ( a tester sous firefox et sous IE donc)
et voila ma page css :



body {
font-family:Verdana, Arial, Helvetica, sans-serif;
margin: 0;
padding: 0;
font-size: 11px;

background-image: url(images/fond2copie.gif);
background-repeat: repeat-y;
float: none;
background-color : black;

}

img{
border: 0 solid #000000;
}

#maintenance {

color : red;
font-weight : bold;
text-align: center;
border-style: solid ;
border-color: #30355D;
border-width:1px;
padding-bottom: 5px;
padding-top: 5px;
}

#header {
height: 97px;
text-align: right;
color: #30355D;
width: 500px

}
#conteneur {
position: absolute;
padding-left: 0px;
margin-top: 0px;
margin-bottom: 0px;
width: 100%;

}

#centre {
margin-left: 135px;
padding-top: 210px;
padding-left: 20px;
padding-right: 20px;
top: 250px;
}
/*#scroll {
height: 215px;
overflow: auto
padding: 10px;
}*/


#formulaire {
position: absolute;
float : center;
width: 100%;

}

#gauche {
position: absolute;
left:0;
width: 150px;
}
#pied {

margin-left: 150px;
margin-top: 30px;
margin-bottom: 10px;
text-align: center;

}

#manifs {
margin-left: 135px;
padding: 250px;
padding-left: 160px;
padding-right: 20px;


}

#participer {
position: absolute;
right: 50%;
left: 45%;
text-align: center;
width: 245px;
background-color:#FFFFFF;
color: #000000;
border-top-style: ridge;
border-right-style: ridge;
border-bottom-style: ridge;
border-left-style: ridge;
border-top-color: #666666;
border-right-color: #666666;
border-bottom-color: #666666;
border-left-color: #666666;

}

#ok{
color: #FFFFFF;
background-position: center center;
position : absolute;
float : center;

}

a {
font-size: 11px;
color : #30355D;
text-decoration : none;
}
a:hover {
font-size: 11px;
color : #30355D;
text-decoration : none;
}
/*a:visited {
font-size: 11px;
color : #30355D;
text-decoration : none;
} */


A.menu{
color: #FFFFFF;
font-size: 13px;
font-weight: bold;
text-decoration : none;
}
A.menu:hover {
text-decoration: underline;
color: #333333;
font-size: 13px;
text-decoration : none;
}

.menugauche {
list-style-type: none;
margin-left: 8px;
padding:0;
letter-spacing:1px;
position:relative;
top: 230px;
}

.imageflottante
{
position:absolute;
top: 0px;
left:0px;

}

.textgeneral {
color: white;
font-size: 11px;
text-align: justify;
}


.titreblanc {
color: white;
font-size: 25px;
font-weight: bold;
letter-spacing: 5px;
text-align: center;
}

.titrenormalcentre2 {
color: white;
font-size: 11px;
text-align: justify;
}


.titreblancsouligne {
color: white;
font-size: 25px;
font-weight: bold;
letter-spacing: 5px;
text-align: center;
text-decoration: underline;
}


.menugauche li {
margin-bottom: 18px;
}


.bold {
font-weight:bold;
color: #FFFFFF;
}
p {
margin: 0 0 10px 0;
text-align: justify;
}

.soustitreBan {
font-size: 17px;
font-weight: bold;
color: # white;
letter-spacing: 5px;
}

.encart {
padding: 5px;
text-align: center;
border: 1px solid #004080;
width:213px;

}
.citation {
font-style:italic;
font-size: 12px;
font-weight:bold;
padding-top : 4px;
}

.signature {
font-style:italic;
font-size: 10px;
font-weight:bold;
}

h1 {
font-weight: bold;
letter-spacing: 2px;
text-align: center;
font-size: 13px;
margin-bottom: 20px;
font-color: white;
}
.legende {
font-size: 10px;
font-style: italic;
}
.legendeAccueil {
font-size: 10px;
font-style: italic;
position:relative;
top:250px;
}

.inscription {
font-size: 14px;
font-weight: bold;
color: #000000;
background-color: #CCCCCC;
text-align: center;

}


.imageAccueil {
margin-right: 10px;
}


.inputNL {
font-size: 10px;
color: #000099;
height: 12px;
width: 100px;
border: 1px solid #FFFFFF;
margin: 1px;
vertical-align: middle;
margin-left: 6px;
}

.participerIntitule {
float:left;
width: 250px;
color: #FFFFFF;


}

.participerChamp {
float:none
}

.textenormalcentre{
font-size: 11px;
color: #FFFFFF;
text-align: center;
}

.ContactIntitule {
float:left;
width: 150px;
color: #FFFFFF;
}

.ContactChamp {
float:none;
color: #FFFFFF;
}

.nlIntitule {
float:left;
width: 70px;
color: #FFFFFF;
}

.nlChamp {
float:none;
color: #FFFFFF;
}

.choralesLi {
list-style-type: none;
h2 {
font-weight: bold;
font-size: 11px;
color: #FFFFFF;
}

.bouton{
font-size: 11px;
font-weight: bold;
color: #004080;
background-color: #FFFFFF;
border: 1px solid #004080;
margin: 2px;
padding: 2px;
width: 100px;
margin-top: 15px;

}

input,textarea {
font-size: 11px;
font-weight: bold;
color: #FFFFFF;
background-color: #000000;
border: 1px solid #00376E;
margin: 2px;
padding: 2px;
width: 200px;
}

.margeDroite10 {
margin-right: 10px;
}

.radio {
width: 15px;
margin-top: 10px;
}

td { font-size: 11px;

}


Donc si quelqu'un a un conseil à me donner parcque je suis pas vraiment calé en css :)
Merci d'avance
Nico
A voir également:

5 réponses

nicolas.paradise Messages postés 5 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 25 janvier 2008
11 janv. 2008 à 14:03
Petites précisions :D
Les problémùes d'affichages se situent au niveau de lemplacement du menu a gauche et du "container" qui contient mes pages php, et donc le coprs des pages, qui sont trop bas sur IE, plus un probléme lorsqu'on clique sur contact et newsletter , les deux derniers boutons (contact et newsletter) n'apparaissent plus (peu etre a cause de la taille de la page , trop petite)
pour finir la lightbox bugg aussi puisque le "masque" sombre qui apparait dérriére els photos n'est pas assez grand sous IE :'(
Voila si quelqu'un se sent de me filer un coup de main je serait le plus heureux! :D
Nico
0
Gihef Messages postés 5150 Date d'inscription mercredi 20 juillet 2005 Statut Contributeur Dernière intervention 20 février 2023 2 776
11 janv. 2008 à 14:43
Bonjour,

Avant de juger de la qualité de ta feuille de styes, fais un peu de ménage dans le code HTML et reviens nous dire ce qu'il en est.

Pour la page d'accueil par exemple.
Actuellement elle est faite comme ç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>
<meta name="description" content="Association Véhicules Historiques Sportifs" />
<meta name="keywords" content="voitures,collection,sportives,anciennes,anciens,autocar,auto,véhicule,courses,rally,historique">
<meta name="robots" content="index,follow">
<META NAME="Revisit-After" CONTENT="7 days">
<title>Association Véhicules Historiques Sportifs</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="rally.css" rel="stylesheet" type="text/css" /></head>
<body>

<div id="conteneur">


<div id="header"><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
</head>
<body>
<div style="text-align: left;"><img alt="Association Véhicule Historique Sportif" src="images/ture.jpg"></div></body>

</body></html></div>


<div id="gauche">

… … …

<style type="text/css">
<!--
.Style1 {color: #FFFFFF}
-->
</style>

<div id="pied"> 
  <div align="center" class="Style1">&copy; Copyright - nicolasbaechel.com</div>
</div>
</div></body></html>
Supprime ce qui est inutile, en double, contradictoire, respecte la structure logique de la page en HTML.
Cette page pourrait être
<!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>
<meta name="description" content="Association Véhicules Historiques Sportifs" />
<meta name="keywords" content="voitures,collection,sportives,anciennes,anciens,autocar,auto,véhicule,courses,rally,historique" />
<meta name="robots" content="index,follow" />
<META NAME="Revisit-After" CONTENT="7 days" />
<title>Association Véhicules Historiques Sportifs</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="rally.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.Style1 {color: #FFFFFF}
-->
</style>
</head>
<body>

<div id="conteneur">


<div id="header">

<div style="text-align: left;">
  <img alt="Association Véhicule Historique Sportif" src="images/ture.jpg" width="---" height="---" />
</div>

</div>


<div id="gauche">

… … …

</div><!-- fin centre -->

<div id="pied"> 
  <div align="center" class="Style1">&copy; Copyright - nicolasbaechel.com</div>
</div>
</div>
</body>
</html>
Tu peux même certainement te passer de .Style1.

--
0
salut,

si tout est ok dans firefox ne touche pas à ton code html, c'est dans le css qu'il faut que tu modifie les balises.
pour ie6 tu met
/* ie 6 */
* html div#nomdetabalise
{
propriétés css;
}

pour ie7,

/* ie 7 */
* +html div#nomdetabalise
{
propriétés css;
}
en gros tu fais refais tes balises css, pour ie7 et ie6.(pas toutes justes celles qui concernent l'emplacement de tes blocs).
0
Gihef Messages postés 5150 Date d'inscription mercredi 20 juillet 2005 Statut Contributeur Dernière intervention 20 février 2023 2 776
11 janv. 2008 à 16:09
“si tout est ok dans firefox” touche quand même au code HTML.
Si, si…

Mais, au cas où ça serait nécessaire afficher un texte juste si le navi est msie plutôt…

--
0
nicolas.paradise Messages postés 5 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 25 janvier 2008
14 janv. 2008 à 12:43
Merci pour tous ces conseils!
Gihef je vais de ce pas nettoyer ma page html et Ayerine je vais essayer ta technique tout de suite et je vous dit si ca fonctionne :)
en tous cas merci déja pour vos réponses!
ps: effectivement je n'ai pas effacer certaines feuilles de styles que je voulais utiliser et qui maintenant sont inutiles
Nico
0

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

Posez votre question
nicolas.paradise Messages postés 5 Date d'inscription vendredi 11 janvier 2008 Statut Membre Dernière intervention 25 janvier 2008
15 janv. 2008 à 10:51
Salut!
Je galére un peu avec ta technique Ayerinne :)
Le code que je doit changer est comme ca :

#centre {
margin-left: 135px;
padding-top: 210px;
padding-left: 20px;
padding-right: 20px;
top: 250px;

}

Ce qui ne marche pas c'est le padding-top donc avec ta technique je dois faire comme ca? :

#centre {
margin-left: 135px;
padding-top: 210px;
padding-left: 20px;
padding-right: 20px;
top: 250px;
}
/* ie 6 */
* html div#centre {
margin-left: 135px;
padding-top: 30px;
padding-left: 20px;
padding-right: 20px;
top: 250px;
}

Chez moi ca fonctionne pas , jvous l'ai dit jsuis loin d'être un pro :p
Merci d'avance
Nico
0