JeuWeb - Crée ton jeu par navigateur

Salut a tous !

Voila, je cherche quelqu'un qui pourrait m'ajouter sur msn par exemple, pour m'aider un resoudre un message que je viens de rencontrer.

J'ai une image (banniere) placé en haut de mon site, et en dessous, une liste (ul et li) en menu horrizontale pour faire des onglet de navigation, que je remonte a l'aide du code suivant :

Code :
margin-top: -50px;

Mais quand je dépasse le chiffre -40px, et bien la moitié de mes boutons disparaissent

Voici un screen expliquant mieux le probleme :

Dans la premiere image, c'est bien placé, mais les autres boutons disparaissent (-45px)
Dans la deuxieme, c'est mal placé (-35px) mais tous les boutons y sont ..
J'espere que quelqu'un pourrait m'aider

Merci d'avance Smile

Oula oula, regarde le problème autrement, pourquoi faire un margin-top: -50px ?

Regarde un peu ca : http://www.alsacreations.com/tuto/lire/5...horizontal

cela depend à quoi est relatif ton ta div (position absolute, fixed ou relative)

Moi je veux bien t'aider Big Grin

Envoie moi un MP pour ton adresse ;P

le code concerné est le suivant :

Code :
ul 

{

 padding:0;

 margin:0;

 list-style-type:none;

 }

li 

{

 float:left; 

 border-left:1px solid black;

 }

ul li a 

{

 font-size: 18px;

 display:inline;

 float:left;   

 width:180px;

 line-height:36px; 

 background:black url(img/bouton.png) repeat-x;

 color:#DCDCDC;

 text-decoration:none;

 text-align:center;

 margin-top: -49px;

 }

ul li a:hover

 {

 background:black url(img/boutonhover.png) repeat-x;

 color:white;

#banniere

{

  margin-top:-20px;  

}

#menu

{

 position: relative;

 }

Code :
<div id="menu"> 

     <div id="banniere"> 

     </div>

     <div id="bouton"> 

     <ul>

      <li><a href="#">Accueil</a></li>

      <li><a href="#">Présentation</a></li>

      <li><a href="#">Forum</a></li>

      <li><a href="#">Charte</a></li>

      <li><a href="#">Contact</a></li>

     </ul>

     </div>

   </div>

Je reflechis ou je pourrais mettre position, je crois que c'est la clé de mon probleme Confused

<div id="menu">
<div id="banniere"> </div>
<ul id="button>
<li><a href="#">Accueil</a></li>
<li><a href="#">Présentation</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Charte</a></li>
<li><a href="#">Contact</a></li>
</ul>
</div>

tres simple

#button {
margin:0;
padding:0;
list-style:none;
}
#button li
display:block;
float:left;
margin-right:5px; /* on les espace */
}
#button li a {
display:block;
height:tailleimage-padding;
width:tailleimage-padding;
background: url("Path/to/img") no-repeat top left;
padding:padding;
}

Et voila tu a un superbo menu fonctionnel et valide W3C

Merci Thib4s, quelques légères modifications, et c'est niquel Smile

De rien ;P
J'ia mis le code de base pour faire des menu horizontaux avec des listes c'est clair que j'ai pas mis en forme avec tes balises sorry :S

Ha non mais t'inquiète c'est parfait comme ca Smile

JeuWeb - Crée ton jeu par navigateur

DiabloTC

Shudrum

php_addict

Thib4s

DiabloTC

Thib4s

DiabloTC

Thib4s

DiabloTC