Sujets similaires

Sujet: [Problème] menu déroulant Mer 05 Jan 2011, 13:45

Salut à tous ! Bonne année Wink

Donc je rentre direct dans le problème que je rencontre.
Je fais actuellement un site qui contient une navigation donc avec un

. J'aimerai y intégrer dans cette navigation un menu déroulant, le menu se déroule très bien le seul problème c'est qu'il prend la

de la navigation donc le même style c'est là que je n'arrive pas a changer ...

Screen : ICI

index.html

Code:: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<title>TPE</title>
<link rel="stylesheet" media="screen" href="styles.css" />
</head>
<body><div id="page">

<div id="header"><div id="menu">
<div id="speedbar">
<ul class="niveau1">
<li style="margin: auto; width: 15px;"><img src="images/menucorngauche.jpg"></img></li>
<li style="margin: auto; width: 16.0%; "><a href="index.html">Accueil</a></li>
<li style="margin: auto; width: 16.1%;"><a href="#">Fonctionnement</a></li>
<li style="margin: auto; width: 16.1%;"><a href="#">Energetique</a></li>
<li style="margin: auto; width: 16.0%;"><a href="#">Limites</a></li>
<li style="margin: auto; width: 16.0%;"><a href="#">Conclusion</a></li>
<li style="margin: auto; width: 16.0%;" class="sousmenu"><a href="#"><img src="images/fleche.png"></img>  Annexes</a>
<ul class="niveau2">
<li><a href="#">Bibliographie</a></li>
<li><a href="#">Définitions</a></li>
   <li><a href="#">Schémas</a></li>
   <li class="sousmenu"><a href="#">Fiches personelles</a>
      <ul class="niveau3">
<li><a href="#">Quentin LEREBOURS</a></li>
<li><a href="#">Guillaume MOREL</a></li>
                           <li><a href="#">Jérémy PERCHE</a></li>
</ul>
                           </li>
</ul></li>
<li style="margin: auto; width: 19px;"><img src="images/menucorndroite.jpg"></img></li>
</ul></div><br>
</div>

<div id="contenu"><div class="coins2">
<div id="hg">
<div id="hd">

<p>
Aujourd'hui dans le monde, nous entendons parler de réchauffement climatique, de développement durable, incluant les fontes de la banquise qui aurai des conséquences désastreuses. A cela, nous ajoutons les énergies renouvelable. Une énergie renouvelable est une énergie exploitable par l'homme mais qui a la différence des énergies fossiles, ne j'épuiserai jamais. Dans celles-ci, nous avons comme source le soleil, l'eau mais aussi le vent. Chacune de ces sources a été exploité: Le soleil donne l'énergie solaire, via les panneaux photovoltaïques; l'eau donne l'énergie hydraulique, tirée des barrages et l'éolien est tiré de la force du vent.<br>
L'éolien offshore est une des deux sortes de méthode pour créer de l'énergie à partir du vent. Offshore signifiant en français "au large" ou mot à mot "hors rives", c'est donc une énergie dite renouvelable, implantée en mer, utilisant l'énergie du vent dans de meilleurs conditions.</br>
C'est cette dernière énergie que nous étudions. Avant de commencer je vous propose de parler un bref instant de l'histoire de l'éolienne puis des objectifs fixés par l'Union Européen en matière d'énergie renouvelable.</br>
Historique Eolien</br>
Suite au Grenelle de l'environnement, les pays participants ont prit la décision de faire d'avantage participer les énergies renouvelables, afin de diminuer nos émissions de gaz à effet de serre et nos déchets nucléaires. En effet 23% de notre consommation devrait en provenir. C'est le double de 2006. Les estimations annoncent que l'éolien Offshore participera à 7 de ces 23%. En France, éolien terrestre représentait 23% de l'objectif en janvier 2009, en revanche aucun parc en mer n'a été autorisé.<br>
Nous pouvons donc nous demandés: L'éolien Offshore est il une avancée énergétique en Europe ? Nous répondrons à la question en trois parties. Nous commencerons par la fabrication de cette éolienne, puis nous analyserons le bilan énergétique de cette énergie, pour finir par les limites posées.
</p>
</div></div></div>
</div></div></div>
<center><div id="footer"><p>Copyright © 2011 - <strong>MOREL Guillaume</strong> & <strong>LEREBOURS Quentin</strong> & <strong>PERCHE Jérémy</strong> - Tous droits réservés.</p></div></center>
</body>
</html>

Styles.css

Code:: body {background-color: #353535;}
#page {
width: 900px;
margin-left: auto;
margin-right: auto;
}
#header{background-image: url('images/header.jpg');width: 900px;height: 180px;}
#speedbar ul {padding:0;margin:0;width: 100%;list-style-type:none;}
#speedbar li {float:left;}
#speedbar ul li a {display:block;float:left; width:100%;line-height:52px; /*hauteur de l'image de fond*/background-image: url(images/menucenter.jpg);color: white; text-decoration:none;text-align:center;font-family: Arial, Verdana, serif; font-size: 14px; font-weight: bold;}
#speedbar ul li a:hover {color: #000000;font-family: Arial, Verdana, serif; font-size: 14px; font-weight: bold;}
#speedbar{padding-top: 20%;}
#speedbar a img{ border: none;}
#contenu{background-color: white;width: 900px;background: bottom;}
.coins2 {background-color: white;}
#hg {background:url(images/centrecoingauche.jpg) no-repeat bottom left;}
#hd {background:url(images/centrecoindroite.jpg) no-repeat bottom right;}
#contenu p{padding-left: 2%;padding-bottom: 2%;padding-right: 2%;}
#footer{color: white; font-size: x-small ;}
/* fichier pour internet explorer */
body {
behavior: url(csshover.htc);
}

/* On cache tous les sous menu avec la propriété display none */
div#menu ul ul {
top: 28.4%;
left: 66%;
display:none
}

/*Lors du survol ,avec la souris, les sousmenu apparaissent grace a display: block */
div#menu ul.niveau1 li.sousmenu:hover ul.niveau2,
div#menu ul.niveau2 li.sousmenu:hover ul.niveau3 {
display:block;}
div#menu ul ul{
background-color : black;
list-style : none;
}

Autre problème, on voit que lorsque le curseur est sur l'onglet et que le menu se déroule, le texte dans #contenu descend.

Merci d'avance !

Cordialement,
PokeR

Sujet: Re: [Problème] menu déroulant Jeu 06 Jan 2011, 19:39

Euh j'ai pas tout compris^^.

Quels sont tes problèmes?

James

Sujet: Re: [Problème] menu déroulant Ven 07 Jan 2011, 06:31

Bonjour,

Citation :: lorsque le curseur est sur l'onglet et que le menu se déroule, le texte dans #contenu descend.

Il faut placer la partie déroulante (ton ul niveau 2/3 je crois) en position:absolute pour qu'il se mette par dessus. Par contre, un élément en position absolute se place par rapport à son plus proche parent déjà positionné... Donc précise bien sur tes li de menu qui ont un float left que leur position est relative (mettre le float:left déclare déjà la position en relativ implicitement, mais faut l'indiquer explicitement pour absolute ^^ enfin, il me semble ^^')

Sinon, je n'ai pas bien compris ton premier problème... Ton sous-menu hérite du style css de ton menu, mais rien ne t’empêche de le modifier si ça te déplaît, non? Tu as bien différencié par des classes (niveau 1/2/3), donc en partant de là, il te suffit d'appliquer le style que tu veux au niveau que tu souhaites... Ou alors je n'ai pas bien compris ton souci =)

Kiwi

Sujet: Re: [Problème] menu déroulant Mar 11 Jan 2011, 15:36

Bonsoir
Votre problème a été résolu ? S'il est,veuillez cochez l'icône résolu dans votre premier message en l'éditant
Merci.

Sujet: Re: [Problème] menu déroulant Lun 17 Jan 2011, 02:59

Bonsoir,

L'auteur n'a donné aucune réponse depuis la dernière relance d'un modérateur. Je considère le sujet comme résolu ou abandonné . De ce fait,je classe dans résolu,merci de votre compréhension.

[Problème] menu déroulant

[Problème] menu déroulant

Sujets similaires

Sujets similaires

Partenaires Or