28172 sujets

CSS et mise en forme, CSS3

Menu dérroulant têtu

Bonjour à tous !

Voici mon problème.
Je suis en train de réaliser un menu derroulant pour afin de remplacer les boxe de base. Le problème c'est qu'il ne recemble pas du tout à un menu derroulant.
Voici la code afin de comprendre :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Document sans nom</title>

<style type="text/css">
<!--
.Style1 {color: #FFFF00}
-->
</style></head>

<body>
<ul id="MenuBar1" class="MenuBarVertical">
  <li><a class="MenuBarItemSubmenu" href="#">Catalogue</a>
    <ul>
      <li><a class="MenuBarItemSubmenu" href="#">Chien</a>
        <ul type="disc">
          <li><a href="#">Pro plan</a>
            <ul>
              <li><a href="#">Petit chien</a>
                <ul>
                  <li><a href="#">Stade de vie</a>
                  <li><a href="#">Besoins Spécifiques</a>
                </ul>          
              <li><a href="#">Moyen chien</a>
                <ul>
                  <li><a href="#">Stade de vie</a>
                  <li><a href="#">Besoins Spécifiques</a>
                </ul>
              <li><a href="#">Grand chien</a>
                <ul>
                  <li><a href="#">Stade de vie</a>
                  <li><a href="#">Besoins Spécifiques</a>
                </ul>
              </li>
            </ul>
          <li><a href="#">Royal Canin</a>
            <ul>
              <li><a href="#"> Mini</a>
                <ul>
                  <li><a href="#">Special race</a>
                  <li><a href="#">Stade de vie </a>
                  <li><a href="#">Besoins spécifiques</a>
                </ul>
              <li><a href="#">Medium</a>
                <ul>
                  <li><a href="#">Special race</a>
                  <li><a href="#">Stade de vie </a>
                  <li><a href="#">Besoins spécifiques</a>
                </ul>
              <li><a href="#">Maxi</a>
                <ul>
                  <li><a href="#">Special race</a>
                  <li><a href="#">Stade de vie </a>
                  <li><a href="#">Besoins spécifiques</a>
                </ul>
              <li><a href="#">Giant</a>
                <ul>
                  <li><a href="#">Special race</a>
                  <li><a href="#">Stade de vie</a>
                </ul>
              </li>
            </ul>  
          <li><a href="#">Hill's</a>
            <ul>
              <li><a href="#">Mini</a>
                <ul>              
                  <li><a href="#">Stade de vie</a>
                  <li><a href="#">Besoins spécifiques</a>
                </ul>
              <li><a href="#">Adult</a>
                <ul>
                  <li><a href="#">Stade de vie</a>
                  <li><a href="#">Besoins spécifiques</a>
                </ul>
              <li><a href="#">Large Breed</a>
                <ul>
                  <li><a href="#">Stade de vie</a>
                  <li><a href="#">Besoins spécifiques</a>             
                </li>
              </ul>
            </li>
          </ul>
        </li>
      <li><a class="MenuBarItemSubmenu" href="#">Chat</a>            
        <ul>
          <li><a href="#">Pro Plan</a>              
            <ul>
              <li><a href="#">Stade de vie</a>
              <li><a href="#">Besoins spécifiques</a>
            </ul>
          <li><a href="#">Royal Canin</a>              
            <ul>
              <li><a href="#">Special Race</a>
              <li><a href="#">Stade de vie</a>
              <li><a href="#">Vie à l'intérieur</a>
              <li><a href="#">Ayant accès à l'extérieur</a>                  
              <li><a href="#">Besoins spécifiques</a>
            </ul>
          <li><a href="#">Hill's</a>              
            <ul>
              <li><a href="#">Stade de vie</a>                  
              <li><a href="#">Besoins spécifiques</a>
            </ul>
          </li>
        </ul>
      </li>
    </ul>  
  </li>  
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgRight:"SpryAssets/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>
</html>


Et voici le lien pour vous rendre compte du problème : http://max-lgb.ifrance.com

Merci à ceux qui m'aideront à m'en sortir !
Max
Sujet clos
Aller à