Discussion :

[c-top]

Voila j'utilise ce bout de code pour espacer les titres de mon menu

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
.menuhaut a{
margin-left: 10%;
font-size: 16px;
font-weight: bold;
color: #060C6F;
text-decoration: none;
}

Dans ma page html les titres ne sont pas regulièrement espacés

J'aimerais
titre1____________titre2____________titre3____________titre4

J'ai
titre1____________titre2__________titre3________titre4

Je pense que le 10% du margin-left fait son calcul avec l'espace restant disponible sur la ligne ?????
Quelqu'un a-t-il une idée pour resoudre mon problème.

modéré par denisC : modification du titre

[francis m]

peux voir le code html ?

[c-top]

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
<div class="menuhaut">
<div id="menu_deroulant">
 
<dl>
<dt onmouseover="javascript:montre('');"><a href="../index.html">Accueil</a></dt>
</dl>
 
<dl>
<dt onmouseover="javascript:montre('smenu2');"><a href="planning.html">Planning</a></dt>
<dd id="smenu2" onmouseover="javascript:montre('smenu2')"; onmouseout="javascript:montre()";>
<ul>
<li><a href="planning.html">Sep - Oct</a></li>
<li><a href="planning_nov.html">Nov - Dec</a></li>
</ul>
</dd>
</dl>
 
<dl>
<dt onmouseover="javascript:montre('smenu1');"><a href="contact.html">Contact</a></dt>
<dd id="smenu1" onmouseover="javascript:montre('smenu1')"; onmouseout="javascript:montre()";>
<ul>
<li><a href="contact.html">Sep - Oct</a></li>
<li><a href="contact_nov.html">Nov - Dec</a></li>
</ul>
</dd>
</dl>
<dl>
<dt onmouseover="javascript:montre();"><a href="controles.html">Contr&ocirc;les</a></dt>
</dl>
</div>
</div>

Je rajoute la classe menuhaut

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
 
.menuhaut{
margin-top: 1em;
padding-left: 8%;
height: 80px;
}

[francis m]

quel est le style de menu_deroulant ?
c'est quoi les dl et dt (je ne connais pas désolé)

[ilood]

[...]Je pense que le 10% du margin-left fait son calcul avec l'espace restant disponible sur la ligne ?????
Quelqu'un a-t-il une idée pour resoudre mon problème.

Non en fait le 10% se ait sur le bloc conteneur, c'est à dire le dt. Donc tu te retrouve avec 10% de la largeur d'un dt. Je suppose que tes dt ne sont pas de la même largeur d'où un problème d'homogénéité des marges.

Pour résoudre le problème tu dois fixer une largeur identique pour tous les dt.

ex:

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
#menu_deroulant dt { width: 300px; }
.menuhaut a { 
margin-left: 10%;
...
}

c'est quoi les dl et dt (je ne connais pas désolé)

dl, dt, dd sont des balises permettant de définir une liste de définitons (respectivement definiton list, def title, def description)

[c-top]

Ca y est j'ai fixé une largeur identique pour tous les dt, c'est ok si les titres ont même longueur, mais moi tous les titres ont des longueurs différentes du coup

j'ai

Titre1__________Montitre2_______UntroisièmeTitre___Titre4

[c-top]

Pas d'idée :