Menu page html [Résolu]

Signaler
-
 etomit -
bonjour je suis actuellement entrain de faire un site
en créeant un menu j'ai remarqué qu'apres ajout de texte
les menu deroulant faisait bouger mon text ce qui me gene
j'aimerai savoir quelle commande me permettrai d'eviter le mouvement de mon texte en meme temps que l'ouverture d'un menu

voici le code html

<!DOCTYPE html>
<html lang="fr">
<head>
<link rel="stylesheet" href="CSS/background.css">
<link rel="stylesheet" href="CSS/menu-horizontal.css">
<link rel="stylesheet" href="CSS/video.css">
<meta charset="utf-8">
<title>CCF D'ART timothée Maire</title>
</head>
<body>
<header>
<nav>
<ul class="niveau1">
<li><a href="">Accueil</a></li>
<li class="sousmenu"><a href="">Histoire</a>
<ul class="niveau2">
<li><a href="">Time line</a></li>
<li><a href=""></a></li>
<li><a href="">Recherche de stage</a></li>
<li><a href="">Documents</a></li>
</ul>
</li>
<li><a href="">Univers</a></li>
<li><a href="">Manga</a></li>
<li><a href="">Arme/Zanpakuto</a></li>
<li class="sousmenu">
<a href="">Personage</a>
<ul class="niveau2" id="scrollmenu">
<li><a href="">Ichigo Kurosaki</a></li>
<li><a href="">Isshin Kurosaki</a></li>
<li><a href="">Masaki Kurosaki</a></li>
<li><a href="">Karin Kurosaki</a></li>
<li><a href="">Yuzu Kurosaki</a></li>
<li><a href="">Uryu Ishida</a></li>
<li><a href="">Orihime Inoue</a></li>
<li><a href="">Yasutora sado</a></li>
<li><a href="">Rukia Kuchiki</a></li>
<li><a href="">Byakuya Kuchiki</a></li>
<li><a href="">Renji Abarai</a></li>
<li><a href="">Ikkaku madarame</a></li>
<li><a href="">Kenpachi Zaraki</a></li>
<li><a href="">Yachiru kusajishi</a></li>
<li>Yoruichi shihouin<a href=""></a></li>
<li><a href="">Toshiro hitsugaya</a></li>
<li><a href="">Rangiku Matsumoto</a></li>
<li><a href="">Sosuke Aizen</a></li>
<li><a href="">Kisuke Urahara</a></li>
<li><a href="">Mayuri Kurotsuchi</a></li>
<li><a href="">Yamamoto Genryusai</a></li>
<li><a href="">Jushiro Ukitake</a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</li>
<li><a href="">Ou acheter ?</a></li>
</ul>
</nav>
</header>
<br>
<p>
bla bla bla
</p>
</body>
</html>

2 réponses

j'ai oublié de poster le code css le voici

nav ul li { float:left; list-style: none; }
nav ul ul {display:none; width:150px;}
nav li {background:#CCCCCC;}
nav li a {text-decoration: none; color: #000; padding: 4px 0 4px; display:block; width:150px;}
nav ul {padding: 0; margin:0px; text-align:center;}
nav ul.niveau1 li.sousmenu:hover ul.niveau2{display:block;}
nav li:hover {background: #EDD;}
nav li.sousmenu:hover {background: #EBB;}
#scrollmenu
{
overflow-x: hidden;
overflow-y: scroll;
width :150px;
height:200px;
}
Salut,
ça va se jouer du côté CSS en effet:

nav  ul.niveau1 li.sousmenu:hover ul.niveau2{display:block;}

Donc soit vus prévoyez l'espace avant soit vous déplacez l'affichage du menu pour pas qu'il chevauche le reste.
> Atari
j'aimerai justement que le menu(deroulant) passe par dessus le texte car actuellement il fait descendre mon texte lors de son ouverture
j'aimerai justement que mon menu passe par dessus mon texte (les menu ouvrant) car le menu statique lui passe déjà au dessus de mon texte