HTML problem avec image et internet explorer
yex
-
briiiiix Messages postés 624 Statut Membre -
briiiiix Messages postés 624 Statut Membre -
Bonjour,
j'ai un souci avec un site internet que je suis entrain de monter. Je veux insérer une image en haut de la page. Le problème c'est que avec Firerox l'image marche parfaitement tant dit que sous Internet Explorer l'image ne s'affiche pas et il y a un petit croix a la place. Sur d'autre sites, j'arrive a voir les images, donc je pense pas que ce soit un plug-in manquant .
Je vous met mon code en espérant que qq voit si j'ai fait 1 erreur.
le html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="crazy_sounds.css" />
<TITLE>Accueil</TITLE>
</HEAD>
<BODY>
<div id="banniere"><img src="Banniere_Page_Accueil.jpg">
</div>
<div id="Menu">
<div class="element_menu">
<h3>MENU</h3>
<ul>
<li><a href="page4.html">Genres</a></li>
<li><a href="page5.html">Artistes</a></li>
<li><a href="page6.html">Albums</a></li>
</ul>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
</div>
</div>
<div id="contenu">
Il nous reste quand même quelques petits trucs à décorer dans notre corps. Par exemple, les titres : on va changer leur police pour mettre une "Arial" plus jolie je trouve sur les titres.
On va aussi rajouter une image de fond sur les titres h2, avec background-repeat:no-repeat;, ce qui signifie que le fond ne se répètera pas (il restera donc à gauche).
Pour éviter que le texte du titre ne s'écrive sur l'image de fond, on met un padding-left de quelques pixels. Comme ça, on aura une image d'engrenage devant chaque titre <h2> automatiquement !
</div>
<div id="pied_de_page">
Webmaster
</div>
</BODY>
</HTML>
le CSS:
body
{
width: 760px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
background-image: url("metal_background.jpg");
}
#banniere
{
width: 760px;
height: 100px;
background-repeat: no-repeat;
margin-bottom: 10px;
}
#Menu
{
float: left;
width: 150px;
background-color: #626262;
background-repeat: repeat-x;
border: 2px solid black;
color: white;
font-size: 30px;
height:600px
}
.element_menu h3
{
text-align: center;
}
#contenu
{
margin-left: 170px;
margin-bottom: 20px;
padding: 5px;
color: white;
background-color: #626262;
background-repeat: repeat-x;
border: 2px solid black;
font-size: 20px;
font-family: "Comic Sans MS", "Trebuchet MS", Georgia, serif;
height: 595px;
}
#pied_de_page
{
padding: 5px;
text-align: center;
color: #B3B3B3;
background-color: #626262;
background-image: url("images/motif.png");
background-repeat: repeat-x;
margin-top: 10px;
border: 2px solid black;
}
merci bien pour l'attention porté à mon problem.
j'ai un souci avec un site internet que je suis entrain de monter. Je veux insérer une image en haut de la page. Le problème c'est que avec Firerox l'image marche parfaitement tant dit que sous Internet Explorer l'image ne s'affiche pas et il y a un petit croix a la place. Sur d'autre sites, j'arrive a voir les images, donc je pense pas que ce soit un plug-in manquant .
Je vous met mon code en espérant que qq voit si j'ai fait 1 erreur.
le html:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="crazy_sounds.css" />
<TITLE>Accueil</TITLE>
</HEAD>
<BODY>
<div id="banniere"><img src="Banniere_Page_Accueil.jpg">
</div>
<div id="Menu">
<div class="element_menu">
<h3>MENU</h3>
<ul>
<li><a href="page4.html">Genres</a></li>
<li><a href="page5.html">Artistes</a></li>
<li><a href="page6.html">Albums</a></li>
</ul>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
<BR>
</div>
</div>
<div id="contenu">
Il nous reste quand même quelques petits trucs à décorer dans notre corps. Par exemple, les titres : on va changer leur police pour mettre une "Arial" plus jolie je trouve sur les titres.
On va aussi rajouter une image de fond sur les titres h2, avec background-repeat:no-repeat;, ce qui signifie que le fond ne se répètera pas (il restera donc à gauche).
Pour éviter que le texte du titre ne s'écrive sur l'image de fond, on met un padding-left de quelques pixels. Comme ça, on aura une image d'engrenage devant chaque titre <h2> automatiquement !
</div>
<div id="pied_de_page">
Webmaster
</div>
</BODY>
</HTML>
le CSS:
body
{
width: 760px;
margin: auto;
margin-top: 20px;
margin-bottom: 20px;
background-image: url("metal_background.jpg");
}
#banniere
{
width: 760px;
height: 100px;
background-repeat: no-repeat;
margin-bottom: 10px;
}
#Menu
{
float: left;
width: 150px;
background-color: #626262;
background-repeat: repeat-x;
border: 2px solid black;
color: white;
font-size: 30px;
height:600px
}
.element_menu h3
{
text-align: center;
}
#contenu
{
margin-left: 170px;
margin-bottom: 20px;
padding: 5px;
color: white;
background-color: #626262;
background-repeat: repeat-x;
border: 2px solid black;
font-size: 20px;
font-family: "Comic Sans MS", "Trebuchet MS", Georgia, serif;
height: 595px;
}
#pied_de_page
{
padding: 5px;
text-align: center;
color: #B3B3B3;
background-color: #626262;
background-image: url("images/motif.png");
background-repeat: repeat-x;
margin-top: 10px;
border: 2px solid black;
}
merci bien pour l'attention porté à mon problem.
A voir également:
- HTML problem avec image et internet explorer
- Internet explorer 11 - Télécharger - Navigateurs
- Internet explorer - Guide
- Internet explorer 8 - Télécharger - Navigateurs
- Internet explorer 10 - Télécharger - Navigateurs
- Explorer patcher - Télécharger - Personnalisation
10 réponses
Bonjour.
C'est quelle image qui pose problème ?
Déjà, tu fais du XHTML strict, du coup il faut fermer les balises :
=>
Et profites-en pour définir tes attributs alt et title.
C'est quelle image qui pose problème ?
Déjà, tu fais du XHTML strict, du coup il faut fermer les balises :
<img src="Banniere_Page_Accueil.jpg">
=>
<img src="Banniere_Page_Accueil.jpg" />
Et profites-en pour définir tes attributs alt et title.
l'image en question est ma banniere (Banniere_Page_Accueil.jpg). elle est en format jpeg bien évidemment
Essaye en faisant un clic-droit sur l'image => Afficher l'image.
Si elle s'affiche, c'est a priori qu'il y a un problème dans ta page.
Tu as essayé de fermer tes balises, et de les passer en minuscule ? (profites-en pour me dégager ces BR inutilse, et les replacer par une mise en page dans ton CSS !)
Si elle s'affiche, c'est a priori qu'il y a un problème dans ta page.
Tu as essayé de fermer tes balises, et de les passer en minuscule ? (profites-en pour me dégager ces BR inutilse, et les replacer par une mise en page dans ton CSS !)
re, merci encore pour l'attention porté a mon cas.
Alors j'ai testé le chemin absolue dont tu parle briiix. Malheureusement ca ne change rien.
Par contre, je me rend compte que ma banniere sous format jpeg que j'ai fait sous photoshop ne marche pas et que l'arrière fond de mon site qui est aussi sous le format jpeg et dont j'ai téléchargé d'un site spécialisé marche parfaitement.
Alors la question dont je me pose c'est, est ce que le fait que je l'ai fait sous photoshop pourrais m'empecher de l'afficher sur interet explorer?
Alors j'ai testé le chemin absolue dont tu parle briiix. Malheureusement ca ne change rien.
Par contre, je me rend compte que ma banniere sous format jpeg que j'ai fait sous photoshop ne marche pas et que l'arrière fond de mon site qui est aussi sous le format jpeg et dont j'ai téléchargé d'un site spécialisé marche parfaitement.
Alors la question dont je me pose c'est, est ce que le fait que je l'ai fait sous photoshop pourrais m'empecher de l'afficher sur interet explorer?
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
AAAAAAhhhHHHHHHHHHHHHHHHHH
J'ai enfin trouvé le problem, il suffisait de sauvegarder en .GIF et tout marche nikel.
Merci pour votre aide.
++
J'ai enfin trouvé le problem, il suffisait de sauvegarder en .GIF et tout marche nikel.
Merci pour votre aide.
++
essaies de mettre le chemin absolu de cette image
exemple
<img src="http://www.monsite.com/images/Banniere_Page_Accueil.jpg" />
ou si tu es en local
<img src="http://127.0.0.1/monsite/images/Banniere_Page_Accueil.jpg" />
Attention aux majiscules, certains serveurs sont très sensibles a la casse.
Bon travail
exemple
<img src="http://www.monsite.com/images/Banniere_Page_Accueil.jpg" />
ou si tu es en local
<img src="http://127.0.0.1/monsite/images/Banniere_Page_Accueil.jpg" />
Attention aux majiscules, certains serveurs sont très sensibles a la casse.
Bon travail
