Menu 5 onglets

Menu 5 onglets - HTML/CSS - Programmation

Marsh Posté le 08-02-2009 à 19:12:54    

Hello les gens,
je dois réaliser un site avec un bandeau à 5 onglets. Il marche nickel sous Mozilla mais je coince avec IE. Des idées ?

 
Code :
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>Le site de la liste "Les Temps d'Art"</title>
  6. <style type="text/css">
  7. <!--
  8. body {
  9. margin: 0;
  10. padding: 0;
  11. background-color:#e8ff93;
  12. }
  13. #container {
  14. width: 65%;
  15. margin: 0 auto;
  16. background-color: #CCFF00;
  17. border: 1px solid #000000;
  18. }
  19. #header {
  20. background-color: #FFFFFF;
  21. }
  23. #menu {
  24. height:auto;
  25. margin:none;
  26. }
  28. #content {
  29. background-color:#99CC66;
  30. margin: 0 auto;
  31. padding: 0 auto;
  32. padding-top:none;
  33. height:100%;
  34. overflow:auto;
  35. height:400px;
  36. }
  37. #footer {
  38. clear: both;
  39. }
  40. body,td,th {
  41. font-family: Verdana, Geneva, sans-serif;
  42. font-size:12px;
  43. }
  45. #nav {
  46.   list-style: none ;
  47.   margin: 0 ;
  48.   padding: 0 ;
  49.   overflow: hidden ;
  50.   width:100%;
  51.   }
  52. #nav li {
  53.   float: left ;
  54.   width: 19.75% ; /*A changer*/
  55.   border: 1px solid #600 ;
  56.   /*margin-right: 1px ;*/
  57.   color: #fff ;
  58.   background: #e8ff93 ;
  59.  
  60.   }
  61. #nav li a {
  62.   display: block ;
  63.   background: #e8ff93 ;
  64.   color: #fff ;
  65.   font: 1em "Trebuchet MS",Arial,sans-serif ;
  66.   line-height: 1em ;
  67.   padding: 4px 0 ;
  68.   text-align: center ;
  69.   text-decoration: none ;
  70.   }
  71. #nav li a:hover, #nav li a:focus, #nav li a:active {
  72.   background: #99cc66 ;
  73.   text-decoration: underline ;
  74.   }
  75. --></style>
  76. <!--[if lt IE 7]>
  77. <style type="text/css">
  78. #nav {
  79.   overflow: visible ;
  80.   height: 1% ;
  81.   }
  82. </style>
  83. <![endif]-->
  84. </style>
  85. <body>
  87. <div id="container">
  88.   <div id="header">
  89. <img src="header.jpg" alt="Les temps d'art"/>
  91.   </div>
  92.     <div id="menu" align="center">
  93.     <ul id="nav">
  94.   <li><a href="index.html">Accueil</a></li>
  95.          <li><a href="presentation.html">Présentation</a></li>
  96.   <li><a href="projets.html">Nos projets</a></li>
  97.   <li><a href="team.html">L'équipe</a></li>
  99.   <li><a href="contact.html">Nous contacter</a></li>
  100.  </ul>
  101.   </div>
  103.   <div id="content">
  104.     <p><h2>Bienvenue sur le site de la liste BDA "Les Temps d'Art"</h2></p>
  105.     <p>Sur ce site vous trouverez toutes les informations nous concernant : notre vidéo de promotion, une présentation de l'équipe, nos projets et enfin comment nous contacter.</p>
  106.     </div>
  108.   <div id="footer" align="center">© Les temps d'art 2009
  109.   </div>
  110. </div>
  111. </body>
  112. </html>



Message édité par Glycerin le 08-02-2009 à 19:13:20
Reply

Marsh Posté le 08-02-2009 à 19:12:54   

Reply

Sujets relatifs:

Leave a Replay

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