Internet explorer: mon site est mal positioné - Programmation
TomsGuide.com : 700 000 inscrits répondent à toutes vos questions high-tech et informatique.
Pour obtenir de l'aide, inscrivez-vous gratuitement !
 

Ajouter une réponse



Mot :   Pseudo :  
 
Bas de page
Auteur
 Sujet : Internet explorer: mon site est mal positioné
 
gadjet62
Profil : IDNaute
Plus d'informations
n°67459
11-06-2006 à 11:06:41

Bonjour tous le monde, j' ai fait un site, avec firefox, tout s' affichent correctement. Ce matin, j' ai visité mon site avec internet explorer et là, mauvaise surprise ...
Regardez mon site avec firefox puis avec internet exlorer:
http://bpzoom62.free.fr/decoupe/index.php

Voici les images que j' ai découpé:
http://bpzoom62.free.fr/decoupe/images/

Voici la page index:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>BP Zoom</title>
<link rel="stylesheet" href="style.css" type="text/css">
</head>
<body>

<center>
<div id="contenu">


<div id="header">

</div>


<div id="menu_gauche">
<a id="zone1" href="index.php" title="Accueil"></a>
<a id="zone2" href="index.php?page=legroupe" title="Le Groupe"></a>
<a id="zone3" href="index.php?page=concerts" title="Concerts"></a>
<a id="zone4" href="index.php?page=photos" title="Photos"></a>
</div>

<div id="texte_bg">

<?php
if (isset($_GET["page"])) $page = $_GET["page"];
else $page = 0;
switch ($page){
default : @include("news.php" );break;
case "news" : @include("news.php" );break;
case "legroupe" : @include("legroupe.php" );break;
case "contact" : @include("contact.php" );break;
case "concerts" : @include("concerts.php" );break;
case "photos" : @include("photos.php" );break;
case "telechargements" : @include("telechargements.php" );break;
case "zonefans" : @include("zonefans.php" );break;
}
?>

</div>

<div id="menu_droite">
<a id="zone5" href="index.php?page=telechargements" title="Téléchargements"></a>
<a id="zone6" href="#" title="Livre D'or"></a>
<a id="zone7" href="index.php?page=zonefans" title="Zone Fans"></a>
<a id="zone8" href="index.php?page=contact" title="Contact"></a>
</div>

<div id="footer">
Prochain Concert : Le 17 Juin à Hénin Baumont
</div>



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

Voici la page style.css:

body {
background-color:#cf1b20;
background-repeat:repeat;
font-family:Arial;
font-size:10px;
color:#e9eaea;
margin:0;
padding:0;

scrollbar-face-color:#7E7D7D; /* couleur du dessus des boutons et de la barre de défilement */
scrollbar-arrow-color:#000000; /* couleur des flèches */
scrollbar-track-color:#6E6D6D; /* couleur du fond de la barre */
scrollbar-highlight-color:#333333; /* couleur claire du relief des boutons */
scrollbar-shadow-color:#444444; /* couleur sombre du relief des boutons */
scrollbar-3dlight-color:#555555; /* couleur claire du relief des boutons quand ceux-ci ne sont pas enfoncés */
scrollbar-darkshadow-color:#666666; /* couleur sombre du relief des boutons quand ceux-ci ne sont pas enfoncés */
}

div#contenu {
width:1024px;
height:auto;
}

div#header {
float:center;
background-image:url('./images/header.jpg');
width:801px;
height:122px;
}


div#menu_gauche {
background-image:url('./images/menu_gauche.jpg');
width:132px;
height:502;
float:left;
margin-left:111px !important;
}

#zone1 {
float: left;
width : 77px;
height: 40px;
margin-left: 40px;
margin-top: 60px;
}

#zone2 {
float: left;
width : 104px;
height: 36px;
margin-left: 13px;
margin-top: 50px;
}

#zone3 {
float: left;
width : 97px;
height: 36px;
margin-left: 20px;
margin-top: 54px;
}

#zone4 {
float: left;
width : 75px;
height: 36px;
margin-left: 42px;
margin-top: 64px;
}

div#menu_droite {
background-image:url('./images/menu_droite.jpg');
width:172px;
height:502px;
float:right;
margin-right:112px !important;
}

#zone5 {
float: right;
width : 150px;
height: 40px;
margin-right: 7px;
margin-top: 70px;
}

#zone6 {
float: right;
width : 110px;
height: 36px;
margin-right: 47px;
margin-top: 50px;
}

#zone7 {
float: right;
width : 107px;
height: 36px;
margin-right: 50px;
margin-top: 50px;
}

#zone8 {
float: right;
width : 87px;
height: 36px;
margin-right: 70px;
margin-top: 62px;
}

div#texte_bg {
background-image:url('./images/texte_bg.jpg');
width:497px;
height:502px;
float:left;
overflow:auto;
font-family:Arial;
font-size:10px;
margin-left:0px;
}

div#texte {
width:480px;
height:490px;
}

div#footer {
color:#000000;
background-image:url('./images/footer.jpg');
width:801px;
height:144px;
margin-top:502px;
}

img { display:inline; margin:0; padding:0; }
ul , li { margin:0; padding:0; list-style-type:none; }
a { color:#000000; text-decoration:none; font-weight:bold; }
a:hover { color:#3F3E3E; font-weight:bold; }
h1 { text-align:center; margin:0; }
p { margin:0; padding:0; text-indent:10px; padding-top:10px;}
div.clear { clear:both; }



Est-ce que quelqu' un pourrait me conseiller ?
Merci d' avance !

Liens sponsorisés


Inscrivez-vous ou connectez-vous pour masquer ceci.

Mileskabal
Profil : IDNaute
Plus d'informations
n°67483
11-06-2006 à 13:13:14

Salut,

J'ai regardé ton problème

Y'a un petit truc qui me chiffone, c'est le float right pour le menu de droite...
Essaie de mettre un float left et de supprimer la marge peut être :

Code :
  1. div#menu_droite {
  2. background-image:url('./images/menu_droite.jpg');
  3. width:172px;
  4. height:502px;
  5. float:left;
  6. }
Mileskabal
Profil : IDNaute
Plus d'informations
n°67485
11-06-2006 à 13:32:04

Alors j'ai testé tout çà, et en fait, la solution que je te dit marche pour bien mettre le menu en place...
Par contre après ça déconne, la marge du menu gauche (ce qui fait le centrage de ta page par rapport au header) n'est pas representé pareil su IE et sur Firefox...

Mais j'ai réussi à faire ce que tu voulais, en ajoutant
directement la marge dans l'image....

Si tu veux jeter un oeil :
http://mileskabal.free.fr/bpzoom/

Ca marche sur les deux navigateurs...
Par contre maintenant les area shape pour l'image ne fonctionne plus, à toi de voir ça... ;-)

gadjet62
Profil : IDNaute
Plus d'informations
n°67520
11-06-2006 à 18:31:20

Je donne des nouvelles: j' ai changé la page style.css, j' ai mis celle-ci:

Citation : Page style.css
body {
background-color:#cf1b20;
background-repeat:repeat;
font-family:Arial;
font-size:10px;
color:#e9eaea;
margin:0;
padding:0;
scrollbar-face-color:#7E7D7D; /* couleur du dessus des boutons et de la barre de défilement */
scrollbar-arrow-color:#000000; /* couleur des flèches */
scrollbar-track-color:#6E6D6D; /* couleur du fond de la barre */
scrollbar-highlight-color:#333333; /* couleur claire du relief des boutons */
scrollbar-shadow-color:#444444; /* couleur sombre du relief des boutons */
scrollbar-3dlight-color:#555555; /* couleur claire du relief des boutons quand ceux-ci ne sont pas enfoncés */
scrollbar-darkshadow-color:#666666; /* couleur sombre du relief des boutons quand ceux-ci ne sont pas enfoncés
*/
}
div#contenu {
width:801px;
height:auto;
}
div#header {
float:center;
background-image:url('./images/header.jpg');
width:801px;
height:122px;
}

div#menu_gauche {
background-image:url('./images/menu_gauche.jpg');
width:132px;
height:502;
float:left;
margin-left:0px;
}
#zone1 {
float: left;
width : 77px;
height: 40px;
margin-left: 40px;
margin-top: 60px;
}
#zone2 {
float: left;
width : 104px;
height: 36px;
margin-left: 13px;
margin-top: 50px;
}
#zone3 {
float: left;
width : 97px;
height: 36px;
margin-left: 20px;
margin-top: 54px;
}
#zone4 {
float: left;
width : 75px;
height: 36px;
margin-left: 42px;
margin-top: 64px;
}
div#menu_droite {
background-image:url('./images/menu_droite.jpg');
width:172px;
height:502px;
float:right;
}
#zone5 {
float: right;
width : 150px;
height: 40px;
margin-right: 7px;
margin-top: 70px;
}
#zone6 {
float: right;
width : 110px;
height: 36px;
margin-right: 47px;
margin-top: 50px;
}
#zone7 {
float: right;
width : 107px;
height: 36px;
margin-right: 50px;
margin-top: 50px;
}
#zone8 {
float: right;
width : 87px;
height: 36px;
margin-right: 70px;
margin-top: 62px;
}
div#texte_bg {
background-image:url('./images/texte_bg.jpg');
width:497px;
height:502px;
float:left;
overflow:auto;
font-family:Arial;
font-size:10px;
margin-left:0px;
}
div#texte {
width:480px;
height:490px;
}
div#footer {
color:#000000;
background-image:url('./images/footer.jpg');
width:801px;
height:144px;
clear:both;
}
img { display:inline; margin:0; padding:0; }
ul , li { margin:0; padding:0; list-style-type:none; }
a { color:#000000; text-decoration:none; font-weight:bold; }
a:hover { color:#3F3E3E; font-weight:bold; }
h1 { text-align:center; margin:0; }
p { margin:0; padding:0; text-indent:10px; padding-top:10px;}
div.clear { clear:both; }



Regardez maintenant le site avec firefox, c' est toujours nikel, regardez ensuite avec IE, c' est beaucoup mieu mais le cadre noir se répéte alors qu' il ne le devrait pas. Avez-vous une solution ?

Mileskabal
Profil : IDNaute
Plus d'informations
n°67570
12-06-2006 à 02:03:58

T'as pas vu mon message....


  FORUM Infos-du-Net » Programmation » Internet explorer: mon site est mal positioné

Aller à :
Ajouter une réponse
 

Plan du forum
Forum MesDiscussions.Net, Version 2007.1.2
© 2000-2007 No1Dev
Page générée en 0,809 secondes
Liens
Produits relatifs