Image avec espace en dessous sous FF et pas sous IE

Image avec espace en dessous sous FF et pas sous IE - HTML/CSS - Programmation

Marsh Posté le 09-02-2007 à 20:56:34    

Coucou à tous,
 
Je continue à découvrir les différences d'interprétations entre IE et FF. J'avais jusque là réussi à les surmonter, mais là je bloque.
Je vous soumets donc le problème :
En fait je veux afficher des images les unes en dessous des autres, dans IE, elles sont collées alors que dans FF il y a un espace en bas de la photo.
 
Le résultat est le suivant :http://www.easyconseil.com/test/test.html
 
Le code est là :

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <HTML>
  3. <HEAD>
  4.    <TITLE>Conseil en stratégie</TITLE>
  5.    <style type="text/css">
  6. <!--
  7. #vmenu {
  8.    position:absolute;
  9.    left:15px;
  10.    top:15px;
  11.    margin:0px;
  12.    padding:0px;
  13.    }
  15.    #vsmenu {
  16.    margin-top:0px;
  17.    margin-bottom:0px;
  18.    padding-top:0px;
  19.    padding-bottom:0px;
  20.    }
  21. -->
  23. </style>
  25. </HEAD>
  26. <BODY>
  27.       <div id="vmenu">
  28.          <div id="vsmenu"><IMG SRC="images/vmenu1.gif" WIDTH="184" HEIGHT="33" border="0" alt=""></div>
  29.          <div id="vsmenu"><IMG SRC="images/vmenu.gif" WIDTH="184" HEIGHT="107" border="0" alt=""></div>
  30.          <div id="vsmenu"><IMG SRC="images/vmenu2.gif" WIDTH="184" HEIGHT="33" border="0" alt=""></div>
  31.          <div id="vsmenu"><IMG SRC="images/vmenu3.gif" WIDTH="184" HEIGHT="33" border="0" alt=""></div>
  32.       </div>
  33. </BODY>
  34. </HTML>


 
Voili.  
Si qq1 peut me renseigner merci bcp !
++
 
Pierrick

Reply

Marsh Posté le 09-02-2007 à 20:56:34   

Reply

Marsh Posté le 09-02-2007 à 23:16:10    

Ouh la, je vois que ça pose pb ;)
 
Je continue à avancer dans la création de mon menu, mais j'ai toujours des problèmes de mise en forme !
 
Voilà le nouveau code "évolué" :
 

Code :
  1. <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  2. <HTML>
  3. <HEAD>
  4.    <TITLE>Conseil en stratégie</TITLE>
  5.    <style type="text/css">
  6. <!--
  7. #vmenu {
  8.    position:absolute;
  9.    left:15px;
  10.    top:15px;
  11.    margin:0px;
  12.    padding:0px;
  14.    }
  16.    #vsmenu {
  17.    margin-top:0px;
  18.    margin-bottom:0px;
  19.    padding-top:0px;
  20.    padding-bottom:0px;
  21.    }
  22.    #vssmenu {
  23.    width:182px;
  24.    border-style:solid;
  25.    border-width:1px;
  26.    border-color:#990033;
  27.    margin-bottom:4px;
  28.    }
  29.       #vssmenu ul {
  30.       list-style-type:none;
  31.       list-style-position:inside;
  32.       width:163px;
  33.       padding:0px 10px 0px 10px;
  34.       margin-bottom:5px;
  35.       margin-top:5px;
  36.       }
  37.       #vssmenu ul li {
  38.       line-height:12px;
  39.       padding-left:0px;
  40.       padding-top:5px;
  41.       padding-bottom:5px;
  42.       }
  43.       .serrer {
  44.       letter-spacing:-1px;
  45.       }
  46.       .actif {
  47.       background: url(images/fleche.gif) no-repeat 0px 1px;
  48.       padding-left:25px;
  49.       color:#990033;
  50.       }
  51.          #vssmenu ul li a {
  52.          text-decoration:none;
  53.          color:#666666;
  54.          font-size:11px;
  55.          font-family:Arial;
  56.          font-weight:bold;
  57.          }
  58.          #vssmenu ul li a:hover {
  59.          text-decoration:none;
  60.          color:#990033;
  61.          }
  62. -->
  64. </style>
  66. </HEAD>
  67. <BODY>
  68.       <div id="vmenu">
  69.          <div id="vsmenu"><a href="page1.html"><IMG SRC="images/vmenu1.gif" WIDTH="184" HEIGHT="33" border="0" alt=""></a></div>
  70.          <div id="vssmenu">
  71.             <ul><li><a href="page1.html"><span class="actif">Les métiers du conseil</span></a></li>
  72.                 <li><a href="page1.html">Conseil en stratégie</a></li>
  73.                 <li><a href="page1.html"><span class="serrer">Conseil en stratégie opérationnelle</span></a></li>
  74.                 <li><a href="page1.html">Conseil en organisation et système d'information</a></li>
  75.             </ul>
  76.          </div>
  78.          <div id="vsmenu"><a href="page3.html"><IMG SRC="images/vmenu2.gif" WIDTH="184" HEIGHT="33" border="0" alt=""></a></div>
  79.          <div id="vsmenu"><a href="page4.html"><IMG SRC="images/vmenu3.gif" WIDTH="184" HEIGHT="33" border="0" alt=""></a></div>
  80.       </div>
  81. </BODY>
  82. </HTML>


 
La mise en forme sous Firefox est nickel, mais par contre sous IE, elle part complètement en couille ! la flèche rouge ne s'affiche pas. et les décalages sont bizzare au niveau des puces !
 
Merci de votre aide.
Je continue à chercher de mon coté et si je trouve qqch je vous tiens au courant !
++
Pierrick

Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed