Problème affichage site sur Internet Explorer

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
A voir également:

6 réponses

macgawel Messages postés 664 Date d'inscription   Statut Membre Dernière intervention   89
 
Bonjour.

Il faudrait que tu nous donne ton code (html et CSS), sinon on ne peut rien faire...
0
kmille21
 
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>
0
kmille21
 
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
0
macgawel Messages postés 664 Date d'inscription   Statut Membre Dernière intervention   89
 
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/
0

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

Posez votre question
kmille21
 
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?
0
kmille21
 
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;
}
-1