Div global et menu deroulant
arwen0504
-
arwen0504 -
arwen0504 -
Bonjour,
j'ai un probleme de menu deroulant horizontal qui n'est pas en charge dans un div global,
Voici le code html
<body>
<div id="global">
<div id="header">
</div>
<!--menu principal-->
<div id="menu_principal"></div>
<!--fin menu principal-->
<!--contenu-->
<div id="texte"></div>
<div id="pied_de_page"> </div>
</div>
voici le code css ,valider apr css validator
/* CSS Document 6.css */
body{
width:100%;
height:80%;
background-color:#08090B;
font-family:Arial,Verdana ,"Times New Roman", sans-serif;
}
#global{
height:80%;
width:970px;
background-color:#133631;
margin-left:auto;
margin-right:auto;
background:#96C9EB}
a{
color :#8E3557 ;
text-decoration :none ;
}
a:hover{
text-decoration:underline;
}
/*style du header*/
#header {
height:150px;
width: 100%;
background:url(image/header.jpg) no-repeat;
clear:both;}
.h1{
text-align:right;
height:100px ;
font-family:Arial, Helvetica, sans-serif;
font-size:24px;
}
.p{
position:absolute;}
/*style menu principal*/
#menu_principal{
clear:both;
width: 100%;
list-style-type: none;
position: absolute;
left:9%;
top:140px;
}
#menu_principal li{
float: left;
width: 163px;
margin: 0;
padding: 0;
border: 0;
list-style-type:none;
}
#menu_principal .sousMenu{
display: none;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
}
#menu_principal .sousMenu li{
float: none;
margin: 0;
padding: 0;
border: 0;
width: 163px;
border-top: 1px solid transparent;
border-right: 1px solid transparent;
}
#menu_principal li a:link, #menu_principal li a:visited{
display: block;
height: 1%;
color: #FFF;
background:#3B4E77;
margin: 0;
padding: 4px 8px;
border-right: 1px solid #fff;
text-decoration: none;
}
#menu_principal li a:hover { background-color: #9933FF; }
#menu_principal li a:active { background-color: #9933FF; }
#menu_principal .sousMenu li a:link,
#menu_principal .sousMenu li a:visited{
display: block;
color: #FFF;
margin: 0;
border: 0;
text-decoration: none;
background:#3B4E77 ;
}
#menu_principal .sousMenu li a:hover{
background-image: none;
background-color: #9933FF;
}
#menu_principal li:hover .sousMenu { display: block; }
/*style core de texte*/
#core {
width:500px;
margin-top:80px;
height:1000px;
}
#h2{
margin-left:5px;
}
#texte{
width:800px;
margin-top:80px;
margin-left:40px;
}
#lecon{
text-align:center;
width:630px;
margin-top:60px;
margin-left:250px;
position:relative;}
.h3{
color:#9933CC;
font-weight:bold;
font-size:large;
font-style:oblique;}
#table{
width:800px;
margin-top:100px;
/*float:center;*/
position:absolute;
}
#centre{
margin-right:150px;
margin-top:100px;}
#droite {
position: absolute;
left:0;
width: 150px;
}
#gauche{
float:right;
margin-right:40px;
width:100px;}
#article{
margin-top:100px;
text-align:justify;
width:640px;}
.plop {
text-decoration: blink;
}
#tableau{
width:900px;
padding-top:40px;
/*float:center;*/
margin-left:250px;
padding-bottom:30px;}
#pied_de_page{
vertical-align:bottom;
/*width:978px;
margin-left:133px;*/
background :#CAEEEF;
text-align:center;
margin-top:750px;
border-top:dotted 2px #000000;
}
/* CSS Document */
j'ai un probleme de menu deroulant horizontal qui n'est pas en charge dans un div global,
Voici le code html
<body>
<div id="global">
<div id="header">
</div>
<!--menu principal-->
<div id="menu_principal"></div>
<!--fin menu principal-->
<!--contenu-->
<div id="texte"></div>
<div id="pied_de_page"> </div>
</div>
voici le code css ,valider apr css validator
/* CSS Document 6.css */
body{
width:100%;
height:80%;
background-color:#08090B;
font-family:Arial,Verdana ,"Times New Roman", sans-serif;
}
#global{
height:80%;
width:970px;
background-color:#133631;
margin-left:auto;
margin-right:auto;
background:#96C9EB}
a{
color :#8E3557 ;
text-decoration :none ;
}
a:hover{
text-decoration:underline;
}
/*style du header*/
#header {
height:150px;
width: 100%;
background:url(image/header.jpg) no-repeat;
clear:both;}
.h1{
text-align:right;
height:100px ;
font-family:Arial, Helvetica, sans-serif;
font-size:24px;
}
.p{
position:absolute;}
/*style menu principal*/
#menu_principal{
clear:both;
width: 100%;
list-style-type: none;
position: absolute;
left:9%;
top:140px;
}
#menu_principal li{
float: left;
width: 163px;
margin: 0;
padding: 0;
border: 0;
list-style-type:none;
}
#menu_principal .sousMenu{
display: none;
list-style-type: none;
margin: 0;
padding: 0;
border: 0;
}
#menu_principal .sousMenu li{
float: none;
margin: 0;
padding: 0;
border: 0;
width: 163px;
border-top: 1px solid transparent;
border-right: 1px solid transparent;
}
#menu_principal li a:link, #menu_principal li a:visited{
display: block;
height: 1%;
color: #FFF;
background:#3B4E77;
margin: 0;
padding: 4px 8px;
border-right: 1px solid #fff;
text-decoration: none;
}
#menu_principal li a:hover { background-color: #9933FF; }
#menu_principal li a:active { background-color: #9933FF; }
#menu_principal .sousMenu li a:link,
#menu_principal .sousMenu li a:visited{
display: block;
color: #FFF;
margin: 0;
border: 0;
text-decoration: none;
background:#3B4E77 ;
}
#menu_principal .sousMenu li a:hover{
background-image: none;
background-color: #9933FF;
}
#menu_principal li:hover .sousMenu { display: block; }
/*style core de texte*/
#core {
width:500px;
margin-top:80px;
height:1000px;
}
#h2{
margin-left:5px;
}
#texte{
width:800px;
margin-top:80px;
margin-left:40px;
}
#lecon{
text-align:center;
width:630px;
margin-top:60px;
margin-left:250px;
position:relative;}
.h3{
color:#9933CC;
font-weight:bold;
font-size:large;
font-style:oblique;}
#table{
width:800px;
margin-top:100px;
/*float:center;*/
position:absolute;
}
#centre{
margin-right:150px;
margin-top:100px;}
#droite {
position: absolute;
left:0;
width: 150px;
}
#gauche{
float:right;
margin-right:40px;
width:100px;}
#article{
margin-top:100px;
text-align:justify;
width:640px;}
.plop {
text-decoration: blink;
}
#tableau{
width:900px;
padding-top:40px;
/*float:center;*/
margin-left:250px;
padding-bottom:30px;}
#pied_de_page{
vertical-align:bottom;
/*width:978px;
margin-left:133px;*/
background :#CAEEEF;
text-align:center;
margin-top:750px;
border-top:dotted 2px #000000;
}
/* CSS Document */
A voir également:
- Div global et menu deroulant
- Menu déroulant excel - Guide
- Excel menu déroulant en cascade - Guide
- Menu déroulant google sheet - Accueil - Guide bureautique
- Supprimer menu déroulant excel ✓ - Forum Word
- Canon quick menu - Télécharger - Utilitaires
le probleme précis , et que le iv cocntenant le menu ne s'mboite pas la le div global . IL est donc impossible de le positionner correctement