Problème affichage site sur Internet Explorer
kmille21
-
kmille21 -
kmille21 -
Bonjour,
j'essaie de créer mon premier site web, et je rencontre déjà un problème majeur.
Beaucoup d'indications CSS marchent très bien sur firefox, mais sont laissées de côté par Internet Explorer
exemple : les images de fond dont pas une n'est affichée
le code permettant de souligné en haut et en bas un lien (il le souligne juste en bas)
... ...
A en juger par les nombreux sites que je vois sur IE, c'est tout à fait possible de mettre des images, ou des effets de style sur un site.
J'en appelle donc à votre aide généreuse pour m'indiquer ce que je dois faire.
Merci
j'essaie de créer mon premier site web, et je rencontre déjà un problème majeur.
Beaucoup d'indications CSS marchent très bien sur firefox, mais sont laissées de côté par Internet Explorer
exemple : les images de fond dont pas une n'est affichée
le code permettant de souligné en haut et en bas un lien (il le souligne juste en bas)
... ...
A en juger par les nombreux sites que je vois sur IE, c'est tout à fait possible de mettre des images, ou des effets de style sur un site.
J'en appelle donc à votre aide généreuse pour m'indiquer ce que je dois faire.
Merci
A voir également:
- Problème affichage site sur Internet Explorer
- Internet explorer 11 - Télécharger - Navigateurs
- Site de telechargement - Accueil - Outils
- Internet explorer 8 - Télécharger - Navigateurs
- Site comme coco - Accueil - Réseaux sociaux
- Internet explorer 10 - Télécharger - Navigateurs
6 réponses
voici mon html :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Mon site !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="accueil2.css" />
</head>
<body>
<!-- L'en-tête -->
<div id="en_tete">
</div>
<!-- Les menus -->
<div id="menu">
<div class="element_menu">
<h3>Accueil</h3>
<ul>
<li><a href="page1.html">Lien</a></li>
<li><a href="page2.html">Lien</a></li>
<li><a href="page3.html">Lien</a></li>
</ul>
</div>
<div class="element_menu">
<h3>Accueil</h3>
<ul>
<li><a href="page4.html">Lien</a></li>
<li><a href="page5.html">Lien</a></li>
<li><a href="page6.html">Lien</a></li>
</ul>
</div>
</div>
<!-- Le corps -->
<div id="corps">
<h1>Titre</h1>
<p>
.................<br />
.......................................................
</p>
<h2>Titre</h2>
<p>
.....................<br />
.....................................................
.......................................................
........................................................
</p>
</div>
<!-- Le pied de page -->
<div id="pied_de_page">
<p>Copyright 2008 Corporation, tous droits réservés</p>
</div>
</body>
</html>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
<title>Mon site !</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="accueil2.css" />
</head>
<body>
<!-- L'en-tête -->
<div id="en_tete">
</div>
<!-- Les menus -->
<div id="menu">
<div class="element_menu">
<h3>Accueil</h3>
<ul>
<li><a href="page1.html">Lien</a></li>
<li><a href="page2.html">Lien</a></li>
<li><a href="page3.html">Lien</a></li>
</ul>
</div>
<div class="element_menu">
<h3>Accueil</h3>
<ul>
<li><a href="page4.html">Lien</a></li>
<li><a href="page5.html">Lien</a></li>
<li><a href="page6.html">Lien</a></li>
</ul>
</div>
</div>
<!-- Le corps -->
<div id="corps">
<h1>Titre</h1>
<p>
.................<br />
.......................................................
</p>
<h2>Titre</h2>
<p>
.....................<br />
.....................................................
.......................................................
........................................................
</p>
</div>
<!-- Le pied de page -->
<div id="pied_de_page">
<p>Copyright 2008 Corporation, tous droits réservés</p>
</div>
</body>
</html>
au niveau du html, c'est normal qu'il n'y ait pas de texte, mais juste des points
pour l'instant, je n'ai pas encore de texte : mon but réel n'est pas de créer un site mais de SAVOIR en créer un
la différence peut faire rire certains, mais j'espère que d'autres me comprendrons
en attendant, merci pour votre future aide
pour l'instant, je n'ai pas encore de texte : mon but réel n'est pas de créer un site mais de SAVOIR en créer un
la différence peut faire rire certains, mais j'espère que d'autres me comprendrons
en attendant, merci pour votre future aide
Je comprends bien la nuance - et j'apprécie ;-)
Si tu veux apprendre, je te conseillerais déjà dans un premier temps de mettre des border à tes DIV (avec des couleurs différentes) histoire de les repérer...
Ensuite, vas-y morceau par morceau :
Commence par mettre tes blocs ("menu", "corps"). Au niveau du CSS, mets le minimum (commence sans les images). Puis rajoute les images, et après seulement les attributs de simages (repeat, ...). Pareil pour le reste...
Moins tu en mets, plus c'est facile de trouver le problème.
Il y a un bon site pour le CSS :
https://www.alsacreations.com/
Si tu veux apprendre, je te conseillerais déjà dans un premier temps de mettre des border à tes DIV (avec des couleurs différentes) histoire de les repérer...
Ensuite, vas-y morceau par morceau :
Commence par mettre tes blocs ("menu", "corps"). Au niveau du CSS, mets le minimum (commence sans les images). Puis rajoute les images, et après seulement les attributs de simages (repeat, ...). Pareil pour le reste...
Moins tu en mets, plus c'est facile de trouver le problème.
Il y a un bon site pour le CSS :
https://www.alsacreations.com/
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
merci pour tes conseils
cependant, sais-tu pourquoi les images ne s'affichent pas sur IE ? est-ce un problème de code qui n'est pas reconnu par IE (je sais qu'il y en a bcp, mais je ne les connais pas tous, et je ne sais encore moins comment les remplacer), ou est-ce un problème de photo qu'il faudrait mieux enregistrer sous un autre format?
cependant, sais-tu pourquoi les images ne s'affichent pas sur IE ? est-ce un problème de code qui n'est pas reconnu par IE (je sais qu'il y en a bcp, mais je ne les connais pas tous, et je ne sais encore moins comment les remplacer), ou est-ce un problème de photo qu'il faudrait mieux enregistrer sous un autre format?
et voici mon css :
body
{
width:760px;
margin:auto;
margin-top:20px;
margin-bottom:20px;
background-image:url("images/boule.png");
background-attachment: fixed;
}
/* L'en tête */
/* Le Menu */
#menu
{
float:left;
width:120px;
}
.element_menu
{
background-image:url("images/fond-reflet.png");
background-repeat:repeat;
border:5px double black;
margin-bottom:20px;
}
.element_menu h3
{
color:#B3B3B3;
font-family:Arial, "Arial Black", "Times New Roman", Times, Serif;
text-align:center;
}
.element_menu ul
{
list-style-image:url("");
padding:0px;
padding-left:20px;
margin:0px;
margin-bottom:5px;
}
#menu li a
{
display: block;
font-size: 1em;
font-family: Arial, "Arial Black", "Times New Roman", Times, Serif;
font-weight: bold;
text-decoration: none;
color: #000;
background: #fff;
opacity: 0.5;
filter: alpha(opacity:70);
-khtml-opacity: 0.5;
-moz-opacity: 0.5;
}
#menu li a:hover {
opacity: 0;
filter: alpha(opacity:00);
-khtml-opacity: 0;
-moz-opacity: 0;
}
div#mentions {
font-family: Arial, "Arial Black", "Times New Roman", Times, Serif;
position: absolute;
bottom : 200px;
right : 10px;
width: 400px;
margin: 1em;
padding: 0.5em;
background: #FFF7D2;
-moz-border-radius:10px;
border-radius:10px;
line-height: 1.1;
font-size: 0.9em;
}
/* Le Corps */
#corps
{
margin-left: 140px;
margin-bottom: 20px;
padding: 5px;
color: #B3B3B3;
background-image: url("images/fond-reflet.png");
background-repeat: repeat;
border: 5px double black;
}
#corps h1
{
color: #B3B3B3;
text-align: center;
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}
#corps h2
{
height: 30px;
background-image: url("images/16593.png");
background-repeat: no-repeat;
padding-left: 30px;
color: #B3B3B3;
text-align: left;
}
/* Le pied de page */
#pied_de_page
{
padding: 5px;
text-align: center;
color: #B3B3B3;
background-image: url("images/fond-reflet.png");
border: 5px double black;
}
body
{
width:760px;
margin:auto;
margin-top:20px;
margin-bottom:20px;
background-image:url("images/boule.png");
background-attachment: fixed;
}
/* L'en tête */
/* Le Menu */
#menu
{
float:left;
width:120px;
}
.element_menu
{
background-image:url("images/fond-reflet.png");
background-repeat:repeat;
border:5px double black;
margin-bottom:20px;
}
.element_menu h3
{
color:#B3B3B3;
font-family:Arial, "Arial Black", "Times New Roman", Times, Serif;
text-align:center;
}
.element_menu ul
{
list-style-image:url("");
padding:0px;
padding-left:20px;
margin:0px;
margin-bottom:5px;
}
#menu li a
{
display: block;
font-size: 1em;
font-family: Arial, "Arial Black", "Times New Roman", Times, Serif;
font-weight: bold;
text-decoration: none;
color: #000;
background: #fff;
opacity: 0.5;
filter: alpha(opacity:70);
-khtml-opacity: 0.5;
-moz-opacity: 0.5;
}
#menu li a:hover {
opacity: 0;
filter: alpha(opacity:00);
-khtml-opacity: 0;
-moz-opacity: 0;
}
div#mentions {
font-family: Arial, "Arial Black", "Times New Roman", Times, Serif;
position: absolute;
bottom : 200px;
right : 10px;
width: 400px;
margin: 1em;
padding: 0.5em;
background: #FFF7D2;
-moz-border-radius:10px;
border-radius:10px;
line-height: 1.1;
font-size: 0.9em;
}
/* Le Corps */
#corps
{
margin-left: 140px;
margin-bottom: 20px;
padding: 5px;
color: #B3B3B3;
background-image: url("images/fond-reflet.png");
background-repeat: repeat;
border: 5px double black;
}
#corps h1
{
color: #B3B3B3;
text-align: center;
font-family: Arial, "Arial Black", "Times New Roman", Times, serif;
}
#corps h2
{
height: 30px;
background-image: url("images/16593.png");
background-repeat: no-repeat;
padding-left: 30px;
color: #B3B3B3;
text-align: left;
}
/* Le pied de page */
#pied_de_page
{
padding: 5px;
text-align: center;
color: #B3B3B3;
background-image: url("images/fond-reflet.png");
border: 5px double black;
}