class imbriquées

22 janv. 2009, 19:15

Bonjour
j'ai des class imbriquées mais j'ai un soucis de comprehension du navigateur donc j'en deduit que j'ai buggué qquepart
J'ai une liste et a l'interieur une autre liste

Code : Tout sélectionner

<ul class"liste_menu">
  <li>titre 1</li>
  <li>titre 2
       <ul class=menu_gauche">
               <li>menu 2.1
                      <ul><li>menu 2.2.1</li>
                             <li>menu 2.2.2</li>
                             <li>menu 2.2.3</li>
                       </ul>
                </li>
       </ul>
  </li>
</ul>

j'ai simplifié mais l'idée est là
le probleme vient que liste_menu a une font-size: 18px;
alors que menu_gauche font-size: 12px;
en theorie car en pratique tout est a 18px
ou ai je fait une faute??
merci
Nadege

22 janv. 2009, 19:40

hello,

y a un truc bizarre dans ton code, à un endroit y a 2 li qui s'ouvre mais plus loin y en a qu'un de fermé..

en fait y en a 3 de li, là:

Code : Tout sélectionner

<li>2eme cat<li>
  <li>

mais t'en ferme qu'un seul...

22 janv. 2009, 19:58

voilà jj'ai changé le code au dessus je n'avais pas bien recopié
il y a une arborescence a 3 niveaux en fait

22 janv. 2009, 20:21

tu pourrais montrer ton css steuplait?

23 janv. 2009, 09:34

oui oui voilà le CSS

Code : Tout sélectionner

.menu_gauche {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 12px;
	color: #FFFFFF;
	text-decoration: none;
	text-align: left;
	list-style-type: none;
	line-height: 20px;
	margin-left:10px;
}
.liste-menu {
	list-style-image: url(img/carre_blanc.gif);
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	color: #FFFFFF;
	text-decoration: none;
	text-align: left;
	list-style-position: outside;
	list-style-type: none;
	line-height: 20px;
	margin-left:35px;
}
.liste-menu a{
	list-style-image: url(img/carre_blanc.gif);
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 18px;
	color: #FFFFFF;
	text-decoration: none;
}
.liste-menu a:hover{
	color: #F7DDBD;
}

merci
Nadege JORAND

23 janv. 2009, 11:11

hello nadège,

j'ai testé ton code et je ne vois pas ce qui cloche...

dans firefox:

dans ie:

Je n'ai fais que copier les codes que tu as donnés:

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr">
<head>
  <meta content="text/html; charset=UTF-8"
 http-equiv="content-type" />
  <title>test</title>
  <meta content="stef" name="author" />
  <style type="text/css">
.menu_gauche {
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 18px;
color: #FFFFFF;
text-decoration: none;
text-align: left;
list-style-type: none;
line-height: 20px;
margin-left:10px;
}
.liste-menu {
list-style-image: url(img/carre_blanc.gif);
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 12px;
color: #FFFFFF;
text-decoration: none;
text-align: left;
list-style-position: outside;
list-style-type: none;
line-height: 20px;
margin-left:35px;
}
.liste-menu a{
list-style-image: url(img/carre_blanc.gif);
font-family: Georgia, "Times New Roman", Times, serif;
font-size: 18px;
color: #FFFFFF;
text-decoration: none;
}
.liste-menu a:hover{
color: #F7DDBD;
}
  </style>
</head>
<body>
<ul class="" liste_menu="">
  <li>titre 1</li>
  <li>titre 2
    <ul class="menu_gauche"">
      <li>menu 2.1
        <ul>
          <li>menu 2.2.1</li>
          <li>menu 2.2.2</li>
          <li>menu 2.2.3</li>
        </ul>
      </li>
    </ul>
  </li>
</ul>
</body>
</html>

23 janv. 2009, 12:38

Et ben chez moi ca ne marhce pas jen'ai pas la feuille de styl qui s'adapte aux titre 1 et 2 pour le reste c'est ok
j'ai modiifé le code pour avior la version que j'utilise avec les liens

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" lang="fr"> 
<head> 
  <meta content="text/html; charset=UTF-8" 
 http-equiv="content-type" /> 
  <title>test</title> 
  <meta content="stef" name="author" /> 
  <style type="text/css"> 
.menu_gauche { 
font-family: Georgia, "Times New Roman", Times, serif; 
font-size: 12px; 
color: black; 
text-decoration: none; 
text-align: left; 
list-style-type: none; 
line-height: 20px; 
margin-left:10px; 
} 
.liste-menu { 
list-style-image: url(img/carre_blanc.gif); 
font-family: Georgia, "Times New Roman", Times, serif; 
font-size: 12px; 
color: black; 
text-decoration: none; 
text-align: left; 
list-style-position: outside; 
list-style-type: none; 
line-height: 20px; 
margin-left:35px; 
} 
.liste-menu a{ 
list-style-image: url(img/carre_blanc.gif); 
font-family: Georgia, "Times New Roman", Times, serif; 
font-size: 18px; 
color: black; 
text-decoration: none; 
} 
.liste-menu a:hover{ 
color: #F7DDBD; 
} 
  </style> 
</head> 
<body> 
<ul class="liste_menu"> 
  <li><a href="#">titre 1</a></li> 
  <li><a href="#">titre 2</a> 
    <ul class="menu_gauche"> 
      <li><a href="#">menu 2.1</a> 
        <ul> 
          <li><a href="#">menu 2.2.1</a></li> 
          <li><a href="#">menu 2.2.2</a></li> 
          <li><a href="#">menu 2.2.3</a></li> 
        </ul> 
      </li> 
    </ul> 
  </li> 
</ul> 
</body> 
</html>

Merci
Nadege

23 janv. 2009, 13:09

Et ben chez moi ca ne marhce pas jen'ai pas la feuille de styl qui s'adapte aux titre 1 et 2

Et bien là tu m'en vois étonné, je ne comprends pas du tout quel est ton problème...

23 janv. 2009, 14:16

voilà ce que ca donne sur IE chez moi, tout est en Georgia 18pxet rien en georiga 12px comme sur la class menu_gauche

[Note : ce message a été posté de manière anonyme avant d'être réattribué à son auteur]

class imbriquées

Qui est en ligne