Régler interligne dans les listes...

[nomasis]

Hello...

c'est un truc que j'ai jamais compris et qui ne m'ennuyait pas trop, mais là ce n'est pas le cas.

J'ai ce chti bout de code html :

<div id="menu">
  <span onclick="javascript:montre('smenu1');">Menu 1
 	 <ul id="smenu1">
   	 <li><a href="#">Sous-Menu 1.1</a></li>
   	 <li><a href="#">Sous-Menu 1.2</a></li>
   	 <li><a href="#">Sous-Menu 1.3</a></li>
   	 <li><a href="#">Sous-Menu 1.4</a></li>
   	 <li><a href="#">Sous-Menu 1.5</a></li>
   	 <li><a href="#">Sous-Menu 1.6</a></li>
</ul></span>

Ce qui donne :

Comment faire pour que Sous-Menu 1.1 soit en dessous de Menu 1 avec un interligne simple ?

[Eric (11)]

Déjà menu1 devrait être compris entre des balises tel que <p></p> ou <Hn>/<hn>. Ensuite il te reste à utiliser les css pour gérer l'espace (margin) entre paragraphe (p) ou titre (hn) et liste (ul).

Cordialement, Eric.

[Nissone]

Pour chipoter, à propos de Menu 1, je ne partage pas ton avis.

Menu 1 sous-entend qu'il y aura un Menu 2 ; c'est donc aussi une liste.

<ul>

<li>Menu1

<ul>

<li>Sous-Menu 1.1</li>

<li>Sous-Menu 1.2</li>

</ul>

</li>

<li>Menu2

<ul>

<li>Sous-Menu 2.1</li>

<li>Sous-Menu 2.2</li>

</ul>

</li>

</ul>

Juste sur ce point. Pour la propriété margin, rien à redire

Je crois qu'il est conseillé aussi de préciser le padding, parce que IE et FireFox/Mozilla ne donnent pas les espaces aux listes par défaut de la même manière. (Euh... Elle est compréhensible, ma phrase ?! )

Moi, par habitude, je mets d'office ul, li {padding:0; margin:0}. C'est à voir en fonction de ce qu'on préfère.

[Sebastien]

Menu1 introduit aussi la section qui suit , utiliser une balise hn est donc aussi valable

[Nissone]

Autant pour moi !

[nomasis]

crotte...

je m'en sors pas en fait.

Je m'y suis sans doute mal pris au départ.

Ce que je souhaite faire est simple, mais je dois certainement le compliquer :

Il y a 5 phrases cliquables qui font apparaître un texte en dessous

On clique sur la phrase 1, un texte apparait en dessous

Si on clique sur la phrase 2 cela fait apparaitre le texte et referme le texte de la phrase 1

J'avais donc idée au départ de faire ça avec des listes et un peu de javascript.

Voila le "pourquoi". Mais j'ai pas le "comment".

EDIT : eh pi, les CSS c'est un peu MasterMind pour moi

Modifié 24 Juin 2005 par nomasis

[Mamat]

Un petit coup de pouce concret !

Dans ta page :

<div id="menu">
 <div onclick="javascript:montre('smenu1');" id="menu">
<p>Menu 1</p> <!-- C'est un exemple lis ce que les autres ont dit là dessus -->
  <ul id="smenu1">
    <li><a href="#">Sous-Menu 1.1</a></li>
    <li><a href="#">Sous-Menu 1.2</a></li>
    <li><a href="#">Sous-Menu 1.3</a></li>
    <li><a href="#">Sous-Menu 1.4</a></li>
    <li><a href="#">Sous-Menu 1.5</a></li>
    <li><a href="#">Sous-Menu 1.6</a></li>
</ul></div>

et dans une feuille de style :

#menu p {margin: 0; padding 0;}

#menu ul {margin: 0; padding 0;}

#menu ul li {margin: 0; padding 0;}

un peu bourrin comme mèthode masi après tu adaptes !

[nomasis]

Un petit coup de pouce concret !

....

un peu bourrin comme mèthode masi après tu adaptes !

<{POST_SNAPBACK}>

bourrin, bourrin...

c'est toi qui l'dis.

Ça fait bien le job : http://nomasis.com/nomasis2.php

1] Sous IE le texte démarre fer à gauche, tandis que sous Firefox il y a une indentation.

Peut on mettre ça homogène ?

2] Sous IE Blink n'est pas reconnu semble t-il ? Et j'ai rien trouvé de simple pour que ça clignote. Auriez vous une idée ?

3] Le truc génant du script

<script type="text/javascript">
<!--
window.onload=montre;
function montre(id) {
var d = document.getElementById(id);
	for (var i = 1; i<=10; i++) {
  if (document.getElementById('smenu'+i)) {document.getElementById('smenu'+i).style.display='none';}
	}
if (d) {d.style.display='block';}
}
//-->
</script>

c'est que le dernier menu reste ouvert. Comment peut-on le refermer ?

Modifié 24 Juin 2005 par nomasis

[nomasis]

Point 2 réglé...

mais comme je suppose que ça n'intéresse pas grand monde de faire clignoter des caractères dans IE...

par contre je suis toujours preneur pour l'alignement des li dans Firefox...

[Mamat]

Blink est proptiétaire de netscape si je dis pas de bétise donc a laisser tomber effectivement ;oD je ne pense pas que bcp d'internaute soit encore sur cet ancetre...

[nomasis]

point réglé disais-je : ça marche

(voir http://nomasis.com/nomasis2.php)

Modifié 24 Juin 2005 par nomasis

[Nissone]

<out of topic>Très chouette design ! </out of topic>

[nomasis]

ça me rappelle ma jeunesse

[Sebastien]

Super chouette en effet, je changerais juste les propriété de cursor au survol, qu'on voit où sont les liens

[nomasis]

euh... vous déconnez là ?

vi vi le curseur je m'en charge....

par contre j'arrive pas dans firefox à mettre les li à gauche (sans indentation)

[nomasis]

tiens, c'est curieux :

a:hover {

cursor: hand;

}

ne marche pas...

[Mamat]

heu... mais c'est le comprotement par défaut !

[nomasis]

?

[Mamat]

He bien sauf erreur de ma part tous les liens ont un "curseur:main" ?

[nomasis]

oui mais que je le mette ou pas il n'y a pas de main

[Mamat]

Tu as défini un cursor sur le ul, peut-être viens-tu de découvrir un nouveau bug ;oD

[nomasis]

ça me rassure pas

[Mamat]

Ok cursor hand n'existe pas... c'est pointer ;oD

[nomasis]

que ce soit hand ou pointer c'est pareil

[Mamat]

Tiens donc chez moi pointer passe sur le body...