Rechercher : dans
Par :

Pb de compatibilité IE/Firefox pour site

Dernière réponse le 24 jui 2008 à 09:46:20 Krunchy, le 5 déc 2007 à 11:23:10 
 Signaler ce message aux modérateurs

Bonjour,

Je suis actuellement en stage et je dois créer un site internet. J'ai utilisé le logicile Nvu et j'ai du donc télécharger Firefox. J'ai fini mon site mai le problème c'est qu'il en rend pas du tout pareil sur Internet Explorer.(image décalée, menu plus gros, Image n'apparai plus en fond transparen)
Pouvez vous m'aider svp mon stage ce termine bientôt.

Configuration: Windows XP
Firefox 2.0

Meilleures réponses pour « Pb de compatibilité IE/Firefox pour site » dans :
Autoriser les pop-up pour les sites sécurisés (HTTPS) VoirSi votre navigateur Internet Explorer bloque les fenêtres intempestives pour les sites sécurisés (ceux dont l'adresse commence par https ) et que vous avez besoin de les autoriser, voila un tutoriel pour y remédier : Ouvrir l'éditeur de Base de...
Télécharger IETester VoirSi vous êtes intégrateur web ou simple concepteur web, un grand soucis que vous devez surmonter es la compatibilité de votre site avec tous les navigateurs disponibles. La bête noire de tous est IE6. IETester est un navigateur gratuit permettant de...

1

Soadmystic, le 5 déc 2007 à 11:26:29

Bonjour,

l'utilisation des margin left et right sur la feuille de style CSS ont résolu mon problème, et mon site est compatible avec les 2 navigateurs.

Répondre à Soadmystic

2

Krunchy, le 5 déc 2007 à 11:27:27

Comment fait tu cela?

Répondre à Krunchy

3

Soadmystic, le 5 déc 2007 à 11:37:43
  • +1

Exemple de mon code:

#menu
{
background-repeat:no-repeat;
width:150px;
height:125px;
position:absolute;
margin-top:115px; (ici j'ai appliqué une marge pour mon menu ne soit pas coller avec le haut)
left:0px;
}

Les "margin" te permet d'imposer des marges (en pixels) sur chaques éléments et ils vont s'appliquer de la meme manière sur tout les navigateurs.

http://www.aidenet.com/css/css40a.htm

Répondre à Soadmystic

4

krunchy, le 5 déc 2007 à 11:43:39

Puis-je te donner ma source HTML pour ke tu m'aide?

Répondre à krunchy

5

Soadmystic, le 5 déc 2007 à 11:47:48

Esr ce que tu as une feuille CSS plutot ?

Répondre à Soadmystic

6

krunchy, le 5 déc 2007 à 11:52:06

Voila:


<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Script-Type"
content="text/javascript">
<script type="text/javascript" src="squelettes/js/menuH.js"></script><!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
for (var i = 1; i<=10; i++) {
if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
}
if (d) {d.style.display='block';}
}
//-->
<style type="text/css">
("sytles.css")
</styles>
<!--[if IE]>
style type="text/css">;
<!--
body #id {
background: white;
padding:0;
margin:0;
font-family: verdana, comic sans ms, sans-serif;
font-size: 100%;
color: black;
}
dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position: absolute;
top: 1em;
left: 1em;
width: 10em;
}
#menu dt {
cursor: pointer;
background: #6a5acd;
height: 30px;
line-height: 20px;
margin: 2px 0;
border: 1px solid gray;
text-align: center;
font-weight: bold;
}
#menu dd {
position: absolute;
z-index: 100;
left: 8em;
margin-top: -1.4em;
width: 10em;
background: #87ceeb;
border: 1px solid gray;
}
#menu ul {
padding: 2px;
}
#menu li {
text-align: center;
font-size: 85%;
height: 18px;
line-height: 18px;
}
#menu li a, #menu dt a {
color: #9acd32;
text-decoration: none;
display: block;
}
#menu li a:hover {
text-decoration: underline;
}
#mentions {
font-family: comic sans ms;
position: absolute;
bottom : 200px;
left : 10px;
color: #000;
background-color: #ddd;
}
#mentions a {text-decoration: none;
color: #222;
}
#mentions a:hover{text-decoration: underline;
}
-->
</style><!--[endif]-->
<title>Les Secteurs</title>
</head>
<body
style="background-color: rgb(255, 255, 255); background-image: url(file:///M:/Direction%20G%E9n%E9rale/22%20-%20Communication/Affiche%20Association%202004/fond%20jaune%20DIAPORAMA%20AG%202005.jpg); color: rgb(0, 0, 0); height: 330px;"
alink="#ee0000" link="#0000ee" vlink="#551a8b">
<h1 style="background-color: rgb(154, 205, 50); width: 750px;"><span
style="color: rgb(255, 255, 255); text-decoration: underline;"><span
style="font-family: Arial;">Les
Secteurs  </span>      
 
           
          
           
  </span></h1>
<dl
style="height: 198px; width: 342px; top: 84px; left: 328px; font-family: Arial;"
id="menu">
<dt
style="color: rgb(154, 205, 50); background-color: rgb(255, 255, 255);"
onmouseover="javascript:montre('smenu2');"
onmouseout="javascript:montre();"><a
href="Secteur%20Accueil%20et%20Soins.html"><big><big><span
style="color: rgb(154, 205, 50);">Accueil et Soins</span></big></big></a></dt>
<big><big><br style="color: rgb(154, 205, 50);">
</big></big><dt
style="background-color: rgb(255, 255, 255); color: rgb(154, 205, 50);"
onmouseover="javascript:montre('smenu3');"
onmouseout="javascript:montre();"><a
href="Secteur%20Enfance.html"><big><big>Enfance</big></big></a></dt>
<big><big><br>
</big></big><dt
style="background-color: rgb(255, 255, 255); color: rgb(154, 205, 50);"
onmouseover="javascript:montre('smenu4');"
onmouseout="javascript:montre();"><a
href="Secteur%20Travail%20Prot%E9g%E9.html"><big><big>Travail
Protégé</big></big></a></dt>
<big><big><br>
</big></big><dt
style="background-color: rgb(255, 255, 255); color: rgb(154, 205, 50);"
onmouseover="javascript:montre('smenu5');"
onmouseout="javascript:montre();"><a
href="Secteur%20H%E9bergement%20Adultes.html"><big><big>Hébergement
Adultes</big></big></a></dt>
</dl>
<br>
<a href="nouveau.html"><img
style="border: 0px solid ; position: absolute; top: 357px; left: 403px; width: 170px; height: 51px;"
alt="" src="../Photo/Retour.png"></a><br>
<br>
<div style="text-align: left;"><br>
<br>
<br>
<img
style="width: 240px; height: 267px; position: absolute; top: 87px; left: 19px;"
alt="carte"
src="file:///M:/Direction%20G%E9n%E9rale/22%20-%20Communication/Affiche%20Association%202004/carte.png"><br>
</div>
<div style="text-align: center;"><img
style="position: absolute; z-index: 0; width: 49px; height: 42px; top: 76px; left: 273px;"
alt="" src="../Photo/papillon%20noir.png"></div>
<div style="text-align: center;"><br>
</div>
<div style="text-align: center;"><img
style="position: absolute; z-index: 0; width: 51px; height: 44px; top: 202px; left: 269px;"
alt="" src="../Photo/papillon%20noir.png"><img
style="position: absolute; z-index: 0; width: 51px; height: 44px; top: 140px; left: 270px;"
alt="" src="../Photo/papillon%20noir.png">  
       
     <br>
<br>
<br>
<br>
<br>
<br>
<img
style="position: absolute; z-index: 0; width: 51px; height: 44px; top: 267px; left: 274px;"
alt="" src="../Photo/papillon%20noir.png"><br>
</div>
</body>
</html>

Répondre à krunchy

7

Soadmystic, le 5 déc 2007 à 11:57:06
  • +1

Moi j'ai mis des marges sur TOUT mes DIV pour que tout restent en place sinon y'a certains qui partent à gauche/à droite...
Essai d'en mettre sur tout les éléments div ;)

Répondre à Soadmystic

8

Soadmystic, le 5 déc 2007 à 12:00:52
  • +1

Accompagne les "margin" avec "position: absolute", parce que je crois que les marges ne fonctionnent pas sans ca...

Répondre à Soadmystic

9

krunchy, le 5 déc 2007 à 13:40:42

Sa ne marche pas, peut tu me donner un exemple avec mon CSS stp?

Répondre à krunchy

10

Webline, le 5 déc 2007 à 22:44:22

Salut,
tu peux utiliser les commentaires conditionnels pour corriger les erreurs d'affichage qui se produisent sous ie.
plus d'info : http://forum.alsacreations.com/...

Répondre à Webline

11

 samsam, le 24 jui 2008 à 09:46:20

Bonjour
moi j'ai plutot un pb avec un paramlist; une liste deroulante liee a la base avec un code javascript; si je clique sur ville, la liste des localites de cette ville doivent apparaitre dans une deuxieme liste

le pb c que l'execution se fait sans pb sur firefox , mais sur internet explorer 7 juste la liste des villes fonctionne


et d'autres pb d'affichage de tabber, (menue a anglaits) juste les liens fonctionnent, mais tout s qui est graphique cadres ou couleurs non sur internet explorer!!!!!!

Répondre à samsam
Collection CommentÇaMarche.net