Se connecter avec
S'enregistrer | Connectez-vous

Problème avec l'affichage de mon site sous internet explorer

Dernière réponse : dans Programmation

Bonjour,

Je sais que de nombreux sujets ont été posté sur ce sujet mais je n'arrive pas à trouver la bonne solution pour mon problème.
J'ai des problèmes d'affichage de mon site sur internet explorer.
Sur Firefox tous va bien : mon site est correctement centré sur ma page mais sous IE, l'ensemble de ma page vient se caller à gauche le mon cadre central se duplique de façon bizarre.

voici le code de ma page :
  1. <html>
    

  2. <title>Titre site
    

  3. <link rel="shortcut icon" HREF="images/favicon.ico" >
    

  4. <link rel="stylesheet" type="text/css" href="layout.css" />
    

  5. <style type="text/css">
    

  6. 		<!--
    

  7. .Style2 {color: #58595b}
    

  8. .Style3 {
    

  9. 	color: #17446a;
    

  10. 	font-weight: bold;
    

  11. }
    

  12. a:link {
    

  13. 	color: #58595b;
    

  14. 	text-decoration: none;
    

  15. }
    

  16. a:visited {
    

  17. 	color: #58595b;
    

  18. 	text-decoration: none;
    

  19. }
    

  20. .Style5 {font-size: 10px; color: #58595b; font-weight:bold; }
    

  21. a:hover {
    

  22. 	text-decoration: none;
    

  23. }
    

  24. a:active {
    

  25. 	text-decoration: none;
    

  26. }
    

  27. .Style7 {	color: #58595b;
    

  28. 	font-size: 11px;
    

  29. }
    

  30. .Style12 {font-size: 10px; color: #A55B24; font-weight: bold; }
    

  31. -->
    

  32. </style>
    

  33. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></head>
    

  34.  
  35. <body>
    

  36. <script type="text/javascript">
    

  37.  
  38.   var _gaq = _gaq || [];
    

  39.   _gaq.push(['_setAccount', 'UA-16632565-1']);
    

  40.   _gaq.push(['_trackPageview']);
    

  41.  
  42.   (function() {
    

  43.     var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
    

  44.     ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
    

  45.     var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
    

  46.   })();
    

  47.  
  48. </script>
    

  49.  
  50. <div id="center">
    

  51. 	<div align="center" >
    

  52. 		<div id="navigation">
    

  53. 		<ul>
    

  54. 		<li><a href="1.html">1</a></li>
    

  55. 		  <li><a href="2.html">2</a></li>
    

  56. 		  <li><a href="3.html" class="current">3</a></li>
    

  57. 		  <li><a href="4.html">4</a></li>
    

  58. 		<li><a href="5.html">5</a></li>
    

  59. 		  <li><a href="6.html">6</a></li>
    

  60. 		<li><a href="7.html">7</a></li>
    

  61. 		  </ul>
    

  62. 	  </div>
    

  63.         <div id="main">
    

  64.           <div id="subnavigation">
    

  65.             <p align="center"><img src="images/logo150.png" alt="" width="150" height="150" border="0" usemap="#Map" />
    

  66.                 <map name="Map" id="Map2">
    

  67.                   <area shape="rect" coords="3,3,147,147" href="index.html" />
    

  68.                 </map>
    

  69.             </p>
    

  70.             <ul>
    

  71.               <li class="current"><a href="3b.html" class="current">3b</a></li>
    

  72.               <li class="normal"><a href="3d.html">3d</a></li>
    

  73.               <li class="normal"><a href="3e.html">3e</a></li>
    

  74.               <li class="normal"><a href="3f.html">3f</a></li>
    

  75.               <li class="normal"><a href="3g.html">3g</a></li>
    

  76.               <li class="normal"><a href="3h.html">3h</a></li>
    

  77.               <li class="normal"><a href="3i.html">3i</a></li>
    

  78.               <li class="normal"><a href="3j.html">3j</a></li>
    

  79.             </ul>
    

  80.           </div>
    

  81.           <div id="content2">
    

  82.             <h1 class="Style3">3b</h1>
    

  83.             <p align="justify" class="Style2"> </p>
    

  84.             <p align="justify" class="Style2"><em>« L'<strong>identité  visuelle</strong> est la représentation graphique de l'identité d'une entité : une entreprise, un objet, d'un environnement... Elle exprime grâce à un  style graphique propre à l'entreprise, les valeurs, l'activité et les ambitions  de celle-ci et se traduit par des signes, des couleurs, des formes, des textes  ainsi que des mises en forme.»</em></p>
    

  85.             <p class="Style2">elle vous accompagne pour définir ou redéfinir votre identité visuelle dans son ensemble  et réalise pour vous :</p>
    

  86.             <blockquote>
    

  87.               <p class="Style2">• Logo<br>
    

  88.                 • Charte graphique<br>
    

  89.                 • Slogan</p>
    

  90.             </blockquote>
    

  91.             <p align="justify" class="Style2">elle vous propose également de compléter votre image.</p>
    

  92.             <p align="center" class="Style2"><a href="devis.php">demander un devis</a></p>
    

  93.           </div>
    

  94.           <div class="cleaner">  </div>
    

  95.         </div>
    

  96. 	<div id="footer">
    

  97.   	  <div align="left">
    

  98.   	    <blockquote>
    

  99.   	      <table width="100%" border="0" class="Style7">
    

  100.             <tr>
    

  101.               <td width="73%" align="right" valign="middle" class="Style7"><span class="Style12">tel : 0000000000</span><br>
    

  102.                 <a href="mailto:contact.com" class="Style12">contact.com</a></td>
    

  103.       <td width="27%" valign="top"  class="Style12"><table width="100%" border="0">
    

  104.                   <tr>
    

  105.                     <td width="10%"><img src="images/facebook2.png" width="30" height="30" align="middle"></td>
    

  106.                     <td width="10%"><img src="images/linked.png" width="30" height="30"></td>
    

  107.                     <td width="10%"><img src="images/myspace.png" width="30" height="30"></td>
    

  108.                     <td width="10%"><img src="images/tweeter.png" width="30" height="30"></td>
    

  109.                     <td width="60%"><img src="images/viadeo.png" width="30" height="30"></td>
    

  110.                   </tr>
    

  111.                               </table></td>
    

  112.             </tr>
    

  113.           </table>
    

  114.   	    </blockquote>
    

  115.   	  </div>
    

  116.   	</div>
    

  117.     <div id="footer2">
    

  118.   	  <div align="left">
    

  119.   	    <blockquote>
    

  120.   	      <table width="100%" border="0" class="Style7">
    

  121.             <tr>
    

  122.               <td valign="top" class="Style7"><div align="right" class="Style5"><a href="contact.php" class="Style5">contact</a> | <a href="devis.php">demander un devis</a> | <a href="conditions_de_ventes.html">mentions légales</a> | <a href="plan_site.html">plan du site</a></div></td>
    

  123.             </tr>
    

  124.           </table>
    

  125.   	    </blockquote>
    

  126.   	  </div>
    

  127.   	</div>
    

  128.       	      <p align="center"><span class="Style7"><a href="<a href="http://www.monsiteestvert.fr/engagement_ikoula#logo" target="_blank">http://www.monsiteestvert.fr/engagement_ikoula#logo</a>" target="_blank"><img src="<a href="http://www.monsiteestvert.fr/Portals/0/x-small_logo_blanc.gif" target="_blank">http://www.monsiteestvert.fr/Portals/0/x-small_logo_bla...</a>" border="0" alt="Ce site est hébergé par Ikoula, hébergeur respectueux de l'environnement et acteur du développement durable"></a></a></span> </p>
    

  129. </div>
    

  130.  
  131. </div>
    

  132. </div>
    

  133.  
  134. </body>
    

  135. </html>



et celui de ma page css :


  1. /* CSS Document */
    

  2.  
  3. body  {margin:0;padding:0;}
    

  4.  
  5. html {
    

  6. 	margin:0;
    

  7. 	padding:0;
    

  8. 	font-family:Verdana, Arial, Helvetica, sans-serif;
    

  9. 	font-size:11px;
    

  10. 	background:url(images/font_double5.gif);
    

  11. 	background-repeat:repeat-x;
    

  12. 	background-color:#8BA233;
    

  13. }
    

  14.  
  15. ul, li {
    

  16. 	list-style:none;
    

  17. 	padding:0;
    

  18. 	margin: 0;
    

  19. 	word-spacing: normal;
    

  20. 	float: none;
    

  21. }
    

  22. li a {text-decoration:none; color:#009ee0;}
    

  23. h1 {font-size:19px;font-weight:normal;}
    

  24. img {
    

  25. 	display: block;
    

  26. 	border:none;
    

  27. 	height: auto;
    

  28. 	width: auto;
    

  29. 	top: auto;
    

  30. }
    

  31. img p {margin:0;padding:0;}
    

  32.  
  33. #navigation{
    

  34. 	width:755px;
    

  35. 	height:42px;
    

  36. 	margin-left: 10px;
    

  37. 	margin-right: 10px;
    

  38. }
    

  39.  
  40. #navigation ul{list-style:none;width:730px;margin:0 auto;	}
    

  41. #navigation li{list-style:none;display:block;	float:left;	margin:0 3px;}
    

  42. #navigation li a{	display:block;float:left;color: #fff;text-transform:uppercase;font-size:11px;	font-weight:bold;line-height:42px;text-decoration:none;padding:0 5px;}
    

  43. #navigation li a:hover{color:#0069a2;	background:url(images/menu_023_h.png) no-repeat center top;	}
    

  44. #navigation li a.current{	display:block;float:left;background:url(images/menu_023_c.png) repeat-x;color:#fff;	text-transform:uppercase;font-size:11px;			font-weight:bold;line-height:42px;text-decoration:none;	padding:0 5px;	}
    

  45. #navigation li a:hover.current{ color:#B0B0B0}
    

  46.  
  47.  
  48. #banner {background-image:url(images/banner.gif);background-position: 7px 5px;width:756px;height:110px;background-repeat:no-repeat;}
    

  49.  
  50. #center {
    

  51. background-image:url(images/fenetre_font.png);
    

  52. 	width:775px;
    

  53. 	margin-left:auto;
    

  54. 	margin-right:auto;
    

  55. 	height: 500px;
    

  56. 	margin-top: 20px;
    

  57. }
    

  58.  
  59. .active {;width:185px;padding:0;margin:0;}
    

  60. .current {font-weight:bold;}
    

  61. .normal {background-image:url(images/border2.gif);background-repeat:no-repeat;padding:0;margin:0;}
    

  62. .normal2 {padding:0;margin:0;}
    

  63.  
  64.  
  65. #subnavigation {
    

  66. 	float:left;
    

  67. 	text-decoration: none;
    

  68. 	font-weight:bold;
    

  69. 	margin-left: 5px;
    

  70. }
    

  71. #subnavigation ul li {margin-left:0px;padding-top:9px;padding-bottom:7px; }
    

  72. #subnavigation ul li a {padding-left:25px; }
    

  73. #subnavigation li a:link { color:#fff} /* lien non-visité */
    

  74. #subnavigation li a:visited { color: #fff;} /* lien visité */
    

  75. #subnavigation li a:hover { color: #d7852e; } /* lien survolé */
    

  76. #subnavigation li a.current { color: #a55b24; } /* lien actif */
    

  77. #subnavigation li a:active { color: #a55b24;} /* lien activé */ 
    

  78.  
  79. #content {
    

  80. 	background-repeat:repeat-y;
    

  81. 	float:left;
    

  82. 	width:270px;
    

  83. 	margin-left:5px;
    

  84. 	padding-left:24px;
    

  85. 	line-height:16px;
    

  86. 	margin-top:12px;
    

  87. 	padding-bottom:45px;
    

  88. }
    

  89. #content2 {
    

  90. 	background-repeat:repeat-y;
    

  91. 	float:left;
    

  92. 	width:590px;
    

  93. 	margin-left:10px;
    

  94. 	padding-left:10px;
    

  95. 	line-height:16px;
    

  96. 	margin-top:12px;
    

  97. 	padding-bottom:45px;
    

  98. 	height: 350px;
    

  99. 	overflow: auto;
    

  100. }
    

  101. #content2 a:link { color:#58595b;} /* lien non-visité */
    

  102. #content2 a:visited { color: #58595b;} /* lien visité */
    

  103. #content2 a:hover { color: #bcbcbc;} /* lien survolé */
    

  104. #content2 a:active { color: #666666;} /* lien activé */ 
    

  105.  
  106. #footer {
    

  107. 	font-size:5px;
    

  108. 	text-align:center;
    

  109. 	text-decoration:none;
    

  110. 	font-weight:bold;
    

  111. 	color: #009ee0;
    

  112. 	background-position:top;
    

  113. }
    

  114. #footer a {
    

  115. 	color:#a64c21;
    

  116. }
    

  117.  
  118. .float-left {
    

  119. 	float:left;
    

  120. 	width:auto;
    

  121. 	padding-right:10px;
    

  122. 	margin:0;
    

  123. }
    

  124. .float-none {clear:left;display:block;}
    

  125.  
  126. .cleaner
    

  127. {
    

  128. 	clear:both;
    

  129. 	height:1px;
    

  130. 	Font-size:1px;
    

  131. 	border:0px none;
    

  132. 	margin:0;padding:0;
    

  133. 	background:transparent;
    

  134. }
    

  135. #footer2 {
    

  136. 	font-size:5px;
    

  137. 	text-align:center;
    

  138. 	font-weight:bold;
    

  139. 	color: #009ee0;
    

  140. 	background-position:top;
    

  141. }
    

  142.  
  143. .float-left {
    

  144. 	float:left;
    

  145. 	width:auto;
    

  146. 	padding-top: 0px;
    

  147. 	padding-right:10px;
    

  148. 	margin:0;
    

  149. }
    

  150. .float-none {clear:left;display:block;}
    

  151.  
  152.  
  153. .cleaner
    

  154. {
    

  155. 	clear:both;
    

  156. 	height:1px;
    

  157. 	Font-size:1px;
    

  158. 	border:0px none;
    

  159. 	margin:0;padding:0;
    

  160. 	background:transparent;
    

  161. }
    

  162. #footer2 a:link { color:#a55b24;} /* lien non-visité */
    

  163. #footer2 a:visited { color: #a55b24;} /* lien visité */
    

  164. #footer2 a:hover { color: #bf7f30;} /* lien survolé */
    

  165. #footer2 a:active { color: #d7852e;} /* lien activé */


Si quelqu'un peut me donner un coup de main...
Merci.

Autres pages sur : probleme affichage site internet explorer

Lassé par la pub ? Créez un compte

bon, je suis chiante : problème résolu ! mais j'ai maintenant un problème avec mon pieds de page qui ne se place pas correctement alors que ça rend très bien sous Firefox.
Il est sensé ce placer parfaitement par rapport à une image cadre placé en fond.

bon, je suis arrivée à régler mes problèmes : % au lieu de valeurs fixes, text-align pour centrer les tableaux, et j'ai intégré un code redirigeant vers 2 css différents pour ie et les autres navigateurs : <!--[if IE]><link type="text/css" rel="stylesheet" href="ie.css" /><![endif]--> aprés le <head>.

Bonjour,

J'ai le même probleme que vous le site internet que je viens de créer est bien centre avec firefox, mais avec ie tout le site est sur la gauche.
Apparement vous êtes arrivées à vous en sortir mais vous ne donnez pas la solution.

Pourriez vous me renseigner sur la solution ?

J'utilise nvu pour la création de mon site,

Cordialement,

JP

Bonjour,

Merci tout d'abord d'avoir répondu à ma question.

Je n'ai aucune connaissance dans le langage html, aussi j'ai utilisé le logiciel nvu pour créer mon site.

J'ai centré les cellules, et lorsque je visite le site avec Firefox le site se trouve au milieu de la page mais lorsque j'utilise Internet Explorer le site est sur la gauche, je ne comprends pas ?

L'adresse du site est la suivante www.addmarmande.com

Par avance merci.

JPaul.
Lassé par la pub ? Créez un compte

Créer un nouveau sujet

Tom's guide dans le monde