Créer un compte
Connexion

Css changer l'ouverture du menu

Pour créer et répondre aux sujets, vous devez être connecté.
Ce sujet est résolu.
Pages: 1
Auteur Message
blingcru
12/05/2011 à 23:37:00
blingcru
Membre
Bonjour,

J'aimerais changer la vision de mon menu mais je sais pas comment faire pour que au lieu il defile par le bas qu'il defilerait vers le haut

peut-on m'aide svp ?  :)



<style type="text/CSS">
#menu li ul {
 position:absolute;
 }
</style>
<style type="text/CSS">
#menu li ul {
 position:absolute;
 }


 #menu ul {
 margin:0;
 padding:0;
 list-style-type:none;
 text-align:center;
 }
#menu li {
 float:left;
 margin:auto;
 padding:0;
 background-color:black;
 }
#menu li a {
 display:block;
 width:100px;
 color:white;
 text-decoration:none;
 padding:5px;
 }
#menu li a:hover {
 color:#FFD700;
 }
#menu ul li ul {
 display:none;
 }
#menu ul li:hover ul {
 display:block;
 }
#menu li:hover ul li {
 float:none;
 }
#menu li ul {
 position:absolute;
 }
#menu {
 height:50px;
 }
</style>
 


https://guerredesgangs.net & http://www.bazinio.ca & http://www.thestreet2.ca
ybouane
14/05/2011 à 03:11:27
ybouane
Admin
Bonjour,
donne nous le code html.

Cordialement :)

Image
blingcru
14/05/2011 à 03:28:57
blingcru
Membre
au total sa donne sa
<style type="text/CSS">
#menu li ul {
 position:absolute;
 }
</style>
<style type="text/CSS">
#menu li ul {
 position:absolute;
 }


 #menu ul {
 margin:0;
 padding:0;
 list-style-type:none;
 text-align:center;
 }
#menu li {
 float:left;
 margin:auto;
 padding:0;
 background-color:black;
 }
#menu li a {
 display:block;
 width:100px;
 color:white;
 text-decoration:none;
 padding:5px;
 }
#menu li a:hover {
 color:#FFD700;
 }
#menu ul li ul {
 display:none;
 }
#menu ul li:hover ul {
 display:block;
 }
#menu li:hover ul li {
 float:none;
 }
#menu li ul {
 position:absolute;
 }
#menu {
 height:50px;
 }
</style>


<div id="menu">
<ul>
  <li>

     
     
     
   
<a href="#">Item 1</a>  <ul>
<li><a href="#">Sous-item 1</a></li>
 <li><a href="#">Sous-item 2</a></li>
<li><a href="#">Sous-item 3</a></li>
  </ul> </li>
  <li><a href="#">Item 2</a>
    <ul>
      <li><a href="#">Sous-item 1</a></li>
      <li><a href="#">Sous-item 2</a></li>
      <li><a href="#">Sous-item 3</a></li>
    </ul>
  </li>
  <li><a href="#">Item 3</a>
    <ul>
      <li><a href="#">Sous-item 1</a></li>
      <li><a href="#">Sous-item 2</a></li>
      <li><a href="#">Sous-item 3</a></li>
    </ul></li>
</ul>
</div>



https://guerredesgangs.net & http://www.bazinio.ca & http://www.thestreet2.ca
blingcru
14/05/2011 à 03:30:22
blingcru
Membre
en fais ses la base se que je veux en faire ses pour metre mon chat et l'historique des joueurs dedans qui apparaitera vers le haut  :)

mais pour le reste ses pas de probleme ses qu'il apparait vers le haut mon probleme :/

https://guerredesgangs.net & http://www.bazinio.ca & http://www.thestreet2.ca
ybouane
22/05/2011 à 22:51:19
ybouane
Admin
Bonjour,
essaye ça:
#menu li ul {
 position:absolute;
 }
</style>
<style type="text/CSS">
#menu li ul {
 position:absolute;
 }


 #menu ul {
 margin:0;
 padding:0;
 list-style-type:none;
 text-align:center;
 }
#menu li {
 float:left;
 margin:auto;
 padding:0;
 background-color:black;
 position:relative;
 }
#menu li a {
 display:block;
 width:100px;
 color:white;
 text-decoration:none;
 padding:5px;
 }
#menu li a:hover {
 color:#FFD700;
 }
#menu ul li ul {
 display:none;
 }
#menu ul li:hover ul {
 display:block;
 }
#menu li:hover ul li {
 float:none;
 }
#menu li ul {
 position:absolute;
 bottom:30px;
 }
#menu {
 height:50px;
 }

Cordialement :)

Image
Pages: 1