Sujet Précédent Sujet Suivant

Menu page html

Résolu/Fermé
etomit - 4 nov. 2020 à 13:18
 etomit - 4 nov. 2020 à 20:35
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>
A voir également:

2 réponses

Réponse 1 / 2
etomit
4 nov. 2020 à 13:19
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;
}
0
Atari
4 nov. 2020 à 19:31
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.
0
etomit > Atari
4 nov. 2020 à 20:35
j'aimerai justement que le menu(deroulant) passe par dessus le texte car actuellement il fait descendre mon texte lors de son ouverture
0
Réponse 2 / 2
etomit
Modifié le 4 nov. 2020 à 20:34
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
0

Discussions similaires

la balise <br> ou <br />
faamugol -
rwaness -

8 réponses