Menu déroulant automatique Bouton_activeMenu déroulant automatique Bouton_hoverMenu déroulant automatique Fb-hoverMenu déroulant automatique Fb-active
CSSActif, le forum, n'est plus maintenu. Il est néanmoins disponible pour consultation. Pour des outils pratiques, rendez-vous sur:

Découvrez CSSActif, une collection d'outils et de tutoriels interactifs pour les développeurs Web — HTML, CSS, JavaScript et bien plus!

Derniers sujets
» Système d'onglets simple et personnalisable
Menu déroulant automatique EmptyLun 03 Juin 2024, 17:20 par birds

» Fiche de Présentation RPG
Menu déroulant automatique EmptySam 30 Mar 2024, 22:07 par Peyton972

» [RPG] Fiche personnage avec bannière
Menu déroulant automatique EmptySam 30 Mar 2024, 22:06 par Peyton972

» Structure de Qui Est En Ligne (1)
Menu déroulant automatique EmptyLun 04 Mar 2024, 23:20 par Peyton972

» Qui Est En Ligne - Utopia
Menu déroulant automatique EmptyDim 24 Déc 2023, 18:16 par romee

» Pack forum complet "Androïd Sylver" RPU (N°2)
Menu déroulant automatique EmptyJeu 02 Nov 2023, 06:42 par Hydrar

» Formulaire de connexion rapide amélioré
Menu déroulant automatique EmptySam 04 Mar 2023, 18:57 par Krager

» Avatar centré dans le profil
Menu déroulant automatique EmptySam 11 Fév 2023, 06:04 par Krager

Le Deal du moment : -29%
DYSON V8 Origin – Aspirateur balai sans fil
Voir le deal
269.99 €

Partagez
 

Menu déroulant automatique

Voir le sujet précédent Voir le sujet suivant Aller en bas 
Invité
Invité




Menu déroulant automatique Empty
Bonsoir tout le monde,

D'habitude j'essaie de me débrouiller seul mais là je dois bien avouer que je sèche. bref je suis en train de préparer un message d'accueil avec un menu déroulant automatique. LE problème c'est qu'au survol tout le texte descend, j'aurais aimé faire passer les liens déroulant par dessus le texte :/

Le lien du forum test pour voir mon soucis: http://cherubcampus-test.forumactif.com/forum.htm

Voici mon css et html:
Code:

<div id="menu">
<ul>
  <li><a href="#">Le forum</a></li>
  <li><a href="#">A lire</a>
    <ul>
      <li><a href="#">Règlement</a></li>
      <li><a href="#">chatbox rules</a></li>
      <li><a href="#">Le staff du forum</a></li>
    </ul>
  </li>
<li><a href="#">Vie du forum</a>
    <ul>
      <li><a href="#">Présentation</a></li>
      <li><a href="#">Annonces</a></li>
      <li><a href="#">Suggestions</a></li>
      <li><a href="#">Questions</a></li>
    </ul>
  </li>
<li><a href="#">Partie lecture</a>
    <ul>
      <li><a href="#">Modèle</a></li>
      <li><a href="#">Listing</a></li>
      <li><a href="#">Sélection</a></li>
    </ul>
  </li>
<li><a href="#">Partenariat</a>
    <ul>
      <li><a href="#">Formulaire</a></li>
      <li><a href="#">Nos boutons</a></li>
    </ul>
  </li>
<li><a href="#">Topsites</a>
    <ul>
      <li><a href="#">Top 1</a></li>
      <li><a href="#">Top 2</a></li>
      <li><a href="#">Top 3</a></li>
    </ul>
  </li>
</ul>
</div>


<br>

<table width="100%" align="center" cellspacing="8" cellpadding="0" ><tr>
<td class="cadratablo" width="60%"><center><b>Bienvenue {USERNAME} sur le forum de discussion Méto</b></center>
« Vous aussi vous êtes fan de la saga Méto ? Vous désirez partager votre passion avec d’autres personnes comme vous ? Parler des livres de la saga ? Si la réponse est « oui », alors ce site est fait pour vous ! Vous y trouverez tout l’univers de la saga et vous pourrez aussi participer à des sondages et des discussions diverses autours des livres. Vous pourrez également faire des jeux et discuter de tout ce qui vous passionne en dehors, parler de tout et de rien et de ce que vous aimez. Alors si vous aussi vous êtes fan de l’univers d’Yves Grevet et que vous souhaitez un forum vivant avec une bonne ambiance, rejoignez-nous ! »
</td>
<td class="cadratablo" width="40%"><ul><table border="0" cellspacing="1"><tr><div style="margin:auto;text-align:center;width:100%"><ul><table border="0" cellspacing="2"><tr><td align="left"><div style="margin:auto;text-align:center;width:100%">
<a href="http://meto.forumactif.com/profile.forum?mode=viewprofile&u=1" class="postlink"><img src="http://host.image.files.free.fr/host/4be5b4652f261icons.jpg" border="0" alt="" /></a></div></td><td align="left">
<a href="http://meto.forumactif.com/profile.forum?mode=viewprofile&u=1" class="postlink">Junior</a>, responsable du forum<br>
Contactez moi pour tout soucis.<br>
Infos: <a href="http://meto.forumactif.com/msg.forum?mode=post&u=1" class="postlink">Messagerie</a> | <a href="http://meto.forumactif.com/faq-f3/informations-t16.htm#21" class="postlink">FAQ</a><br>
Statut: Présent <img src="http://i39.tinypic.com/2akl83o.png" border="0" alt="" />

</td></tr></table></ul></div><center><div style="margin:auto;text-align:center;width:100%"><form>
<select style="width: 200px" onchange="location = this.options
[this.selectedIndex].value">
<option selected="selected">
Navigation rapide
</option>

                <option value="http://meto.forumactif.com/les-regles-f2/reglement-du-forum-t1.htm#1">Règlement</option>
                <option value="http://meto.forumactif.com/partenariats-f6/partenariat-regles-t6.htm#10">Partenariat (ouvert aux invités)</option>
                <option value="http://meto.forumactif.com/presentations-f7/modele-de-presentation-t18.htm#24">Présentation</option>
<option value="http://www.facebook.com/pages/Meto/341280728210?v=app_6009294086#!/pages/Meto/341280728210?ref=ts">Groupe Facebook</option>
                <option value="https://twitter.com/meto01">Page Twitter</option>
</select>
</form></div></div></center></td>
</tr>
</table>



Code:
#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;
}

Bonne soirée et merci d'avance Very Happy


Dernière édition par Junior le Dim 01 Aoû 2010, 11:23, édité 1 fois
MessageSujet: Menu déroulant automatique   Menu déroulant automatique EmptyVen 30 Juil 2010, 18:23
Revenir en haut Aller en bas
http://zonescript.forumactif.fr
VPeybernes
{ Membre actif }
{ Membre actif }

Masculin Messages : 563



Menu déroulant automatique Empty
Salut Junior.
Il faut que tes sous-liste soit en position absolu pour quel n'influe pas sur le reste de la mise en page.
MessageSujet: Re: Menu déroulant automatique   Menu déroulant automatique EmptySam 31 Juil 2010, 06:01
Revenir en haut Aller en bas
Invité
Invité




Menu déroulant automatique Empty
Plop Very Happy

Merci, problème réglé Wink
MessageSujet: Re: Menu déroulant automatique   Menu déroulant automatique EmptyDim 01 Aoû 2010, 11:23
Revenir en haut Aller en bas
Contenu sponsorisé




Menu déroulant automatique Empty
MessageSujet: Re: Menu déroulant automatique   Menu déroulant automatique Empty
Revenir en haut Aller en bas
 

Menu déroulant automatique

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

 Sujets similaires

-
» Menu déroulant
» menu déroulant et opacité
» Problème menu déroulant
» Menu auto-déroulant
» Menu déroulant à liens [resolu]

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
CSSActif :: De la théorie à la pratique :: Aide CSS & xHTML :: Problèmes résolus-

Partenaires Or


← Page précédente   ↑ Aller en haut Copyright © CSSActif 2009 - 2013 Tous droits réservés
Créer un forum | ©phpBB | Forum gratuit d'entraide | Signaler un abus | Cookies | Forum gratuit