CSS - première balise ul, css bug

Résolu/Fermé
Utilisateur anonyme - 5 mai 2011 à 17:42
 Utilisateur anonyme - 5 mai 2011 à 18:56
Bonjour,



voici le code source de ma page :
<div id="menu">
	
<ul style="background-color: #EDEDED">
	<li class="liPrem">  <a></a>  </li>

	
	<!-- la balise li se ferme à la fin des sous parties ! -->
	<li class="liPrem"> 
		<a></a>
		<ul>
			<li> <a></a> </li>
		</ul>
	</li>

	
	<li class="liPrem"> <a></a> </li>
	
	<li class="liPrem">
		<a></a>
		<ul>
			<li> <a></a> </li>	
			
			<li>

				<a href="#">Rechercher</a>
				<ul class="ulVerticale">
					<li> <a></a> </li>
					<li> <a></a> </li>
					<li> <a></a> </li>
				</ul>

			</li>
			
			<li>
				<a href="#">Ajouter</a>
				<ul class="ulVerticale">
					<li> <a></a> </li>
					<li> <a></a> </li>
				</ul>
			</li>
			
		</ul>
	</li>
	
	<li class="liPrem"><a href="#">Aide</a>
		<ul>
			<li> <a></a></li>

			<li> <a></a> </li>
		</ul>
	</li>
</ul>
</div> 


Sur la toute premier balise <ul> (celle où j'ai mis un css directement dans la balise).
Rien à faire, elle ne prends pas en compte de background-color.
J'ai essayé le id, class, directement dans le code, dans le fichier annexe etc...

Voici alors mon css :
html, body{
   margin:  0px;
   padding: 0px;
   outline: 0px;
   height:  100%;
   background-color: #494949 ; /*  1.494949 */
}

#en_tete
{
	height:95px;
}

#en_tete a:hover{
	color: #EDEDED;
}

#corps
{
	min-height:640px;  
	margin-top:40px;
}

#corps, #corps input
{
	background-color:white;
}

#pied_de_page
{
	min-height:50px;
}

#msgInfo
{
	margin-left:10px;
}
a
{
	text-decoration : none;
	background-color: none;
	color:#000; /* A66500 */
}

#formConnexion label
{
	float:left;
	display:block;
	width : 100px;
}



															/* Admin */
/* Autorisations pour le personnel */
table
{
	text-align:center;
	margin:auto;
	border-collapse: collapse;
}

th,td
{
	max-width:120px;
	padding-left:10px;
	padding-right:10px;
}

.tdSeparation{
	border-bottom : 2px solid black;
}

.tdPrincipale
{
	min-width:400px;
}

.tdPrincipale60
{
	min-width:60%;
}

.alignLeft, .colonneGauche
{
	text-align:left;
}

/* Ajout et modification */
#tabCAfficheBdd
{
	min-width  : 70%;
}

#tabCAfficheBdd caption
{
	font-size: 1.2em;
	margin: 10px 0 20px 0;
}
#tabCAfficheBdd input
{
	text-align:center;
}

/* Recherche */
#tabRecherche .colonneGauche
{
	min-width : 400px;
}

#menu 
{
	position:absolute;	/* Evite de perturber le contenu */
	width:100%;																	/* A modifier suivant la page */
	margin  : 0;	
	padding : 0; 							
	text-align : center; 
}

#menu ul li:hover
{
background-color: #EDEDED;
}
#menu ul
{
	padding : 0;
	margin  : 0;
	list-style : none; /* on supprime le style par défaut de la liste */
	line-height : 21px;
	background-color: #EDEDED;
	border-right:1px solid black;
	border-left:1px solid black;
}

#menu li
{
	max-height:21px;  /* Sinon on voit apparaître un espace vide pour l'ulVerticale */ 
}

/* Première ligne de balise li */
.liPrem
{
	float:left;
	width: 19%; /* 100/(nbr élements) - 1% de marge */									/* A modifier suivant la page */
	
}

#menu ul li ul, #menu ul li:hover ul .ulVerticale
{
	display:none;
}

#menu ul li:hover ul
{
	display:block;
	margin-left:-1px;
	margin-right:-1px;
}

#menu ul li ul li:hover .ulVerticale
{
	/* faire réaparaitre les listes, mais décalé pour ne pas les superposer */
	display:block;
	position:relative;
	top:-21px;
	left:100%;
	margin:0;
	border-left:1px solid black;
	background-color:#EDEDED;
}


Je ne comprends pas du tout pourquoi la balise ne fonctionne pas. De plus elle n'intervient pas ailleurs donc bon.
Si quelqu'un a une suggestion
A voir également:

2 réponses

Le reste de ton CSS marche quand tu fais appel?
0
Utilisateur anonyme
5 mai 2011 à 17:54
Tout fonctionne, j'ai même été plus loin, j'ai mis le code suivant :

<head>
<link rel="stylesheet" media="screen" type="text/css" title="Design" href="css/menu_mixte.css" />
</head>
<div id="menu">
<ul style="background-color:blue">
<li class="liPrem"> <a href="index.php?nomPage=accueil">Accueil</a> </li>

</ul>
</div>
avec ul{
background-color : blue;
}
Ne fonctionne pas non plus oO
0
Profil bloqué
5 mai 2011 à 18:35
Essaye de créer des balises uniquement pour tes background
0
Utilisateur anonyme
5 mai 2011 à 18:56
j'ai entouré par des balises span la balise ul mais ça ne fonctionne pas.
J'ai contourné le problème en mettant un background sur la balise li, mais c'est quand même étrange oO.
En tout cas merci pour votre temps ^^.
Bonne journée
0
-
0