Problème css

Résolu

habeo -

Bonjour,

Je suis plutôt novice en php et malgrès un nombre incalculable de recherches sur google je n'arrive pas à comprendre se qui cloche.

J'essaye de créer un sommaire, rien de bien sorcier :

link href="style/style.css" rel="stylesheet" type="text/css">   

    <!-- Division pour le sommaire -->   
    <div id="menu">     

        <ul id="menu">   
           <li class="menu">   
              <a href="mapage.php" title="Page d'accueil">Accueil</a>   
           </li>   
              
           <li class="menu">   
              <a href="mapage2.php" title="mapage2">Page 2</a>   
           </li>            
         </ul>        
    </div>

Avec l'extrait du css concerné :

<style type="text/css">   
ul#menu li{    
display : inline;   
padding : 0 1em; /* Pour espacer les boutons entre eux */   
color : #FF0000;   
text-decoration: none;   
}   
ul#menu {   
list-style-type : none; /* Car sinon les puces se placent n'importe où */   
margin-top : 100px;   

}   
</stlye>

Mon souci étant le suivant :
Lorsque je fait varier le padding dans le css, les liens de mon sommaire s'écartent en conséquence mais les propriétés comme color ou text-decoration ne sont pas prise en compte et je ne comprend pas pourquoi.

J'ai le même souci pour redéfinir par exemple le <h1>, j'ai mis pourtant cela dans mon css :

H1  {   
  font-size:300%;   
  color:#FF6699;   
}

Mais rien n'est pris en compte dans mes page lorsque j'utilise les balises <h1></h1> alors que d'autre propriété comme

#body {   
height: 50%;   

margin:50px;   
margin-right:50px;   
padding: 0%;   
position: relative;

passent sans problème.

Merci à quiconque voudrait bien m'aider

ps: je n'ai pas fait attention à la catégorie du post sur le forum et je m'en excuse, je ne pense pas que webmaster soit la plus appropriée :) mais je ne peux pas la changer

Afficher la suite

12 réponses

Utilisateur anonyme

ul#menu li { 
    display: inline; 
    padding: 0 1em; /* Pour espacer les boutons entre eux */ 
     
   } 
   ul#menu { 
    list-style-type: none; /* Car sinon les puces se placent n'importe où */ 
    margin-top: 100px; 
   } 
   ul#menu li a { 
    color: #FF0000; 
    text-decoration: none; 
   }

noyeux joël et bonne fête de fin du monde

Utilisateur anonyme
pour h1 il faudrait voir le code avec le titre

0

Réagir

Réponse 2 / 12
Utilisateur anonyme
Bonjour, déjà vous utiliser deux identifiant menu. Un id doit être unique.
Essayez de mettre h1 et non H1

0

Réagir
Réponse 3 / 12
habeo Auteur
Bonjour lobotoFix,

cela ne change malheureusement rien.

0

Réagir
Réponse 4 / 12
Utilisateur anonyme
Le mieux serai de voir l'ensemble de votre code

0

Réagir
Vous n’avez pas trouvé la réponse que vous recherchez ?

La communauté CCM répond en moyenne en moins de 2h.

Posez votre question
Réponse 5 / 12
Utilisateur anonyme
Vous avez ecrit </stlye> au lieux de </style>

0

Réagir

habeo Auteur

Voici l'ensemble du code du sommaire :

<link href="style/style.css" rel="stylesheet" type="text/css"> 
    <!-- Division pour le sommaire --> 
    <div id="menu">   
        <ul id="menu"> 
           <li class="menu"> 
              <a href="accueil.php" title="Page d'accueil">Accueil</a> 
           </li>            
           <li class="menu"> 
              <a href="map.php" title="mapage2">Snori dans le monde</a> 
           </li> 
    <li class="menu"> 
              <a href="mapage.php" title="Page d'accueil">Notre métier</a> 
           </li> 
      <li class="menu"> 
              <a href="mapage.php" title="Page d'accueil">Contact</a> 
           </li> 
         </ul>                
    </div>

et celui du css:

<style type="text/css">
h1{
font-size:300%;
color:#FF6699;
}
#Presentation{
float:left;
width:100%;
position: relative;
margin: 50 px;
}
#htmlMap {
height: 100%;
}
#bodyMap {
height: 50%;
margin:50px;
margin-right:50px;
padding: 0%;
position: relative;
}
#EmplacementDeMaCarte {
height: 100%
}
/*style du sommaire */
ul#menu li{
display : inline;
padding : 0 1em; /* Pour espacer les boutons entre eux */
color : #FF0000;
text-decoration: none;
}
ul#menu {
list-style-type : none; /* Car sinon les puces se placent n'importe où */
margin-top : 100px;
}
</stlye></code>

Utilisateur anonyme

Bonjour, j'ai corrigé quelques erreurs

<!DOCTYPE html>
<html>
	<head>
		<title>essai</title>
		<meta charset="UTF-8" />
		<style type="text/css">
			ul#saturday {
				margin: 0;
				padding: 0;
				list-style-type: none;
				width: auto;
				position: relative;
				display: block;
				height: 36px;
				text-transform: uppercase;
				font-size: 12px;
				font-weight: bold;
				background: transparent url("images/bgOFF.gif") repeat-x top left;
				font-family: Helvetica, Arial, Verdana, sans-serif;
				border-bottom: 4px solid #336666;
				border-top: 1px solid #C0E2D4;
			}
			ul#saturday li {
				display: block;
				float: left;
				margin: 0;
				padding: 0;
			}
			ul#saturday li a {
				display: block;
				float: left;
				color: #874B46;
				text-decoration: none;
				padding: 12px 20px 0 20px;
				height: 24px;
				background: transparent url("images/bgDIVIDER.gif") no-repeat top right;
			}
			ul#saturday li a:hover {
				background: transparent url("images/bgHOVER.gif") no-repeat top right;
			}
			ul#saturday li a.current, ul#saturday li a.current:hover {
				color: #fff;
				background: transparent url("images/bgON.gif") no-repeat top right;
			}
			/* ^^^^^^^^ ABOVE IS THE CODE FOR THE MENU ^^^^^^^^^^ */

			h1 {
				font-size: 300%;
				color: #FF6699;
			}
			#Presentation {
				float: left;
				width: 100%;
				position: relative;
				margin: 50px;
			}
			#htmlMap {
				height: 100%;
			}
			#bodyMap {
				height: 50%;
				margin: 50px;
				margin-right: 50px;
				padding: 0%;
				position: relative;
			}
			#EmplacementDeMaCarte {
				height: 100%
			}
			/*style du sommaire */
			ul#menu li {
				display: inline;
				padding: 0 1em; /* Pour espacer les boutons entre eux */
				color: #FF0000;
				text-decoration: none;
			}
			ul#menu {
				list-style-type: none; /* Car sinon les puces se placent n'importe où */
				margin-top: 100px;
			}

		</style>
	</head>
	<body>
		<!-- Division pour le sommaire -->
		<div>
			<ul id="menu">
				<li class="menu">
					<a href="accueil.php" title="Page d'accueil">Accueil</a>
				</li>
				<li class="menu">
					<a href="map.php" title="mapage2">Snori dans le monde</a>
				</li>
				<li class="menu">
					<a href="mapage.php" title="Page d'accueil">Notre métier</a>
				</li>
				<li class="menu">
					<a href="mapage.php" title="Page d'accueil">Contact</a>
				</li>
			</ul>
		</div>
	</body>
</html>

Réponse 8 / 12
habeo Auteur
Merci beaucoup d'essayer de m'aider !

J'ai modifier mon code par celui que vous venez de me fournir mais j'ai toujours les mêmes problèmes, mes titre <h1> restent noirs et les <li> de mon sommaire restent bleus et soulignés.

0

Réagir
Réponse 9 / 12
habeo Auteur
Magnifique, merci beaucoup lobotoFix !

Cela a également débloqué les propriétés du h1, tout fonctionne.

Pour info, le a sert à spécifier que l'on définit les propriétés du texte?

0

Réagir
Réponse 10 / 12
Utilisateur anonyme
non c'était les propriétés pour les liens de votre menu et a c est les liens

0

Réagir
Réponse 11 / 12
Utilisateur anonyme
penser à mettre résolu

0

Réagir
Réponse 12 / 12
habeo Auteur
ok,

Merci encore pour tout et bonnes fêtes de fin d'année !

0

Réagir

Problème css

12 réponses

Discussions similaires

Newsletters