18041 sujets

Questions générales et questions de débutants

[RESOLU]Menu horizontal sur mozilla ne colle pas à ma banniere

Bonjour,

j'ai un menu horizontal que je veux coller à mon header, qu'il n'y ait pas de séparation entre les deux.

impeccable sous ie7 mais pas sous firefox3.

voici mon code html
<body>


	<div id="container">
	
    	<div id="entete">	
	
	<object type="application/x-shockwave-flash" width="776" height="120" data="flash/header.swf">
	<param name="movie" value="flash/header.swf" /></object>
			
	
	
        <div id="nav">
		
        <ul>
			
            	<li><a href="index.html" id="highlight">Home</a></li>
                <li><a href="about.html" class="nonHighLight">About</a></li>
                <li><a href="programmes.html" class="nonHighLight">Programmes</a></li>
                <li><a href="eventsAndCamps.html" class="nonHighLight">Events &amp; Campaigns</a></li>

                <li><a href="donate.html" class="nonHighLight">Donate</a></li>
                <li><a href="partners.html" class="nonHighLight">Partners</a></li>
              
            </ul>
       
		</div>
   
     
   
<div id="pied2page">
		
		<a href="mail6.php">Copyright©2008</a>
			<a href="index.html">Accueil</a>
			<a href="charte.html">Charte des enfants</a>
			<a href="mentions.html">Mentions l&#233gales </a> 
			<a href="mail.php">Contact</a>
	</div>
	
	</div>
	


</body>
</html>


et maintenant voici mes css


body {

	font-family:Arial, Helvetica, sans-serif;

	font-size:12px;

	color:#535353;

	background:url(../images/fonds.jpg) repeat-x #D4EEF0;

}



#container{

	width:776px;

	margin:0 auto;

}



#entete{
	width:776px;
	height:120px;
	}

#nav{

	width:776px;

	height:41px;
	
	margin-bottom:10px;

	background:url(../images/nav_bg1.jpg) #66A3A8 repeat-x;


}
#nav ul{

	padding:10px 0px 10px 40px;

}



#nav li{

 	display:inline;

	list-style:none;	

	margin-right:23px;

}



#nav li a.nonHighLight{

	font-family:Arial, Helvetica, sans-serif;

	color:#FFFFFF;

	font-size:15px;

	text-decoration:none;

}



#nav li a.nonHighLight:hover{

	color:#B7E3E6;

}



#nav a#highlight{

	font-family:Arial, Helvetica, sans-serif;

	font-size:15px;

	text-decoration:none;

	color:#B7E3E6;

}


merci si vous pouvez m'aider
Modifié par jeromei (28 Aug 2008 - 12:59)
Bonsoir jeromei,

A première vue, je dirai que tu as oublié de fermer ton conteneur "entête" (avant ou après ton menu ?...)
Qu'il y a sans doute des choses à modifier/améliorer dans ton code html et dans ta feuille de styles.
Et qu'une page de test en ligne ne serait pas de refus si tu désires une aides bien plus efficace Smiley cligne

Cdt,
Sylvain
Bonjour,

Pour l'exemple, j'ai fermé ma div apres le menu et ça ne change rien.

si je la ferme apres mon entete non plus?

j'ai mit le lien

http://jeromei.phpnet.org/rebondir/

je remet aussi nouveau code html

<body>


	<div id="container">
	
    	<div id="entete">	
	
	<object type="application/x-shockwave-flash" width="776" height="120" data="flash/header.swf">
	<param name="movie" value="flash/header.swf" /></object>
			
	
	
        <div id="nav">
		
        <ul>
			
            	<li><a href="index.html" id="highlight">Home</a></li>
                <li><a href="about.html" class="nonHighLight">About</a></li>
                <li><a href="programmes.html" class="nonHighLight">Programmes</a></li>
                <li><a href="eventsAndCamps.html" class="nonHighLight">Events & Campaigns</a></li>

                <li><a href="donate.html" class="nonHighLight">Donate</a></li>
                <li><a href="partners.html" class="nonHighLight">Partners</a></li>
              
            </ul>
       
		</div>
   
   </div>
  

   
   

	
	</div>


</body>
</html>


merci pour votre aide
Bonjour,

Rapidement ... mettre un vertical-align: bottom; sur ton élément object et mettre un margin: 0; sur ton élément ul. Smiley cligne

Bonne continuation.
Romain
Dans les CSS :
- #nav ul (ligne 188) pour le margin ;
- créer un sélecteur (par exemple #entete object) avec le vertical-align.
super,

ça fonctionne. Grand merci!

par contre pour centrer mon menu du coup, j'augmente le margin right dans ma #nav li ligne 211 car je n'arrive pas à le centrer automatiquement ?

ps: Pour réduire; les espaces entre mes différents onglets des menus, quelle est le code?
comme tu l'auras remarqué, je débute!
ok, merci encore

pour resserer menu

	text-align: center;


ligne 52 sur la #nav ul
Modifié par jeromei (28 Aug 2008 - 12:59)
Sujet clos
Aller à