A voir également:
- Pb de compatibilité IE/Firefox pour site
- Site de telechargement - Guide
- Site de vente entre particulier - Guide
- Site inaccessible - Guide
- Compatibilite windows 11 - Guide
- Site de partage de photos - Guide
11 réponses
Soadmystic
Messages postés
1262
Date d'inscription
lundi 22 octobre 2007
Statut
Membre
Dernière intervention
1 avril 2009
249
5 déc. 2007 à 11:37
5 déc. 2007 à 11:37
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
#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
Soadmystic
Messages postés
1262
Date d'inscription
lundi 22 octobre 2007
Statut
Membre
Dernière intervention
1 avril 2009
249
5 déc. 2007 à 11:57
5 déc. 2007 à 11:57
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 ;)
Essai d'en mettre sur tout les éléments div ;)
Soadmystic
Messages postés
1262
Date d'inscription
lundi 22 octobre 2007
Statut
Membre
Dernière intervention
1 avril 2009
249
5 déc. 2007 à 12:00
5 déc. 2007 à 12:00
Accompagne les "margin" avec "position: absolute", parce que je crois que les marges ne fonctionnent pas sans ca...
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
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!!!!!!
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!!!!!!
Soadmystic
Messages postés
1262
Date d'inscription
lundi 22 octobre 2007
Statut
Membre
Dernière intervention
1 avril 2009
249
5 déc. 2007 à 11:26
5 déc. 2007 à 11:26
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.
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.
krunchy
Messages postés
6
Date d'inscription
mercredi 5 décembre 2007
Statut
Membre
Dernière intervention
1 avril 2008
5 déc. 2007 à 11:43
5 déc. 2007 à 11:43
Puis-je te donner ma source HTML pour ke tu m'aide?
Soadmystic
Messages postés
1262
Date d'inscription
lundi 22 octobre 2007
Statut
Membre
Dernière intervention
1 avril 2009
249
5 déc. 2007 à 11:47
5 déc. 2007 à 11:47
Esr ce que tu as une feuille CSS plutot ?
krunchy
Messages postés
6
Date d'inscription
mercredi 5 décembre 2007
Statut
Membre
Dernière intervention
1 avril 2008
5 déc. 2007 à 11:52
5 déc. 2007 à 11:52
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>
<!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>
krunchy
Messages postés
6
Date d'inscription
mercredi 5 décembre 2007
Statut
Membre
Dernière intervention
1 avril 2008
5 déc. 2007 à 13:40
5 déc. 2007 à 13:40
Sa ne marche pas, peut tu me donner un exemple avec mon CSS stp?
Webline
Messages postés
31
Date d'inscription
mercredi 5 décembre 2007
Statut
Membre
Dernière intervention
17 décembre 2007
11
5 déc. 2007 à 22:44
5 déc. 2007 à 22:44
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/faq/faq-53-Qu039est-ce-que-les-commentaires-conditionnels-.html
tu peux utiliser les commentaires conditionnels pour corriger les erreurs d'affichage qui se produisent sous ie.
plus d'info : http://forum.alsacreations.com/faq/faq-53-Qu039est-ce-que-les-commentaires-conditionnels-.html
