Problème css

Résolu
habeo Messages postés 21 Statut Membre -  
habeo Messages postés 21 Statut Membre -
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

12 réponses

  1. 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
    1
    1. Utilisateur anonyme
       
      pour h1 il faudrait voir le code avec le titre
      0
  2. Utilisateur anonyme
     
    Bonjour, déjà vous utiliser deux identifiant menu. Un id doit être unique.
    Essayez de mettre h1 et non H1
    0
  3. habeo Messages postés 21 Statut Membre
     
    Bonjour lobotoFix,

    cela ne change malheureusement rien.
    0
  4. Utilisateur anonyme
     
    Le mieux serai de voir l'ensemble de votre code
    0

  5. Vous n’avez pas trouvé la réponse que vous recherchez ?

    Posez votre question
  6. Utilisateur anonyme
     
    Vous avez ecrit </stlye> au lieux de </style>
    0
  7. habeo Messages postés 21 Statut Membre
     
    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>
    0
  8. 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>

    0
  9. habeo Messages postés 21 Statut Membre
     
    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
  10. habeo Messages postés 21 Statut Membre
     
    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
  11. Utilisateur anonyme
     
    non c'était les propriétés pour les liens de votre menu et a c est les liens
    0
  13. habeo Messages postés 21 Statut Membre
     
    ok,

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

Discussions similaires

indice et exposant en css ?
yiv -
Kitkatryne -

19 réponses
Mettre du texte à côté d'une image
yuls13 -
yuls13 -

3 réponses
Comment aligner des éléments html css
eligame -
Hawkfram -

1 réponse
Faire passer du texte SOUS une image HTML / CSS
Mihai -
animostab -

2 réponses
Superposer du texte sur une image (HTML/CSS)
bh_france -
Semev -

1 réponse