[Résolu] Comment réduire les interlignes en css ?
Comment réduire les interlignes en css ? [Résolu] - HTML/CSS - Programmation
Marsh Posté le 29-08-2005 à 22:19:41
pourquoi ça : <div id="conteneur_menu">
<div id="gauche">
<div class="menu">
<li><a href="http://www.site.com">Accueil</a></li>
<li><a href="http://www.site.com">Pour qui est-ce ?</a></li>
<li><a href="http://www.site.com">Prise de conscience</a></li>
</div></div></div>
alors que
<ul class="menu">
<li><a href="http://www.site.com">Accueil</a></li>
<li><a href="http://www.site.com">Pour qui est-ce ?</a></li>
<li><a href="http://www.site.com">Prise de conscience</a></li>
</ul>
ca suffit largement
et puis on ne met pas des LI tous seuls sans UL
et pour ton interligne, voit ça avec lineheight
Marsh Posté le 29-08-2005 à 22:43:20
Merci pour ta réponse 
Le lineheight est malheureusement valable pour toutes les lignes de mon menu
Moi je voudrais réduire l'interligne entre "Prise de" et "conscience"
---------------
Membre d'honneur du CLUB DOROTHEE (abonné à Dorothée magazine depuis 1978). Directeur honnoraire de l'association "Sauvez Bernard Minet" (plus connue sous le nom de Bernard's Mined Club).
Marsh Posté le 29-08-2005 à 22:59:03
tu vires ton line-height, et met un display : block; sur le A
et un height sur le A
Marsh Posté le 29-08-2005 à 23:43:21
<li><a href="http://www.site.com">Prise de conscience</a></li>
<div> </div> //sur FF je suis obligé de mettre ça sinon les 2 lignes se touchent presques
<li><a href="http://www.site.com">Blablablablablabla</a></li>
a {
text-decoration: none;
display : block;
height: 20px;
}
En effet, avec ton conseil cela marche plutôt bien sous FF par contre sous IE ça ne donne pas un bon résultat 
Mais le height agit sur toutes les lignes du menu quand même
Merci beaucoup de ton aide Gatsusat
Message édité par aragorns le 29-08-2005 à 23:50:05
---------------
Membre d'honneur du CLUB DOROTHEE (abonné à Dorothée magazine depuis 1978). Directeur honnoraire de l'association "Sauvez Bernard Minet" (plus connue sous le nom de Bernard's Mined Club).
Marsh Posté le 29-08-2005 à 23:47:40
ben tu évite le height
et tu joues avec le padding-top et le padding-bottom pour regler les marges intereieures de chacunes de tes boites
Marsh Posté le 29-08-2005 à 23:52:56
a {
text-decoration: none;
display : block;
padding-top: 3px;
padding-bottom: 3px;
}
Nickel sous FF mais très très espacé sous IE
Message édité par aragorns le 29-08-2005 à 23:53:21
---------------
Membre d'honneur du CLUB DOROTHEE (abonné à Dorothée magazine depuis 1978). Directeur honnoraire de l'association "Sauvez Bernard Minet" (plus connue sous le nom de Bernard's Mined Club).
Marsh Posté le 30-08-2005 à 10:06:27
| gatsusat a écrit : ben les margin à 0 |
J'ai essayé ça :
a {
text-decoration: none;
display : block;
padding-top: 3px;
padding-bottom: 3px;
margin-top: 0;
margin-bottom: 0;
margin: 0;
}
Mais cela n'a aucun effet sur IE 
Message édité par aragorns le 30-08-2005 à 10:07:51
---------------
Membre d'honneur du CLUB DOROTHEE (abonné à Dorothée magazine depuis 1978). Directeur honnoraire de l'association "Sauvez Bernard Minet" (plus connue sous le nom de Bernard's Mined Club).
Marsh Posté le 31-08-2005 à 19:59:06
J'ai bidouillé un peu mais il y a toujours une grande différence entre FF et IE 
Je suis vraiment bloqué là-dessus 
.menu {
margin-left: 7px;
margin-right: 5px;
margin-top: 60px;
margin-bottom: 20px;
padding-top: 13px;
padding-bottom: 13px;
font-family: Times, Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 10px;
text-align: center;
}
Extrès du code :
<body>
<div id="conteneur">
<div id="bandeau">
</div>
<div id="gauche">
<ul class="menu_cote menu_cote_gauche_special">
<li><a href="http://www.site.com">Accueil</a></li>
<li><a href="http://www.site.com">Pour qui est-ce ?</a></li>
<li><a style="display : block;" href="http://www.site.com.com">Prise de conscience</a></li>
</ul>
</div>
<div id="centre">
TEXTE
</div>
</div>
</body>
Message édité par aragorns le 31-08-2005 à 20:02:41
---------------
Membre d'honneur du CLUB DOROTHEE (abonné à Dorothée magazine depuis 1978). Directeur honnoraire de l'association "Sauvez Bernard Minet" (plus connue sous le nom de Bernard's Mined Club).
Marsh Posté le 01-09-2005 à 10:41:59
Ayé, j'ai trouvé 
Après moulte bidouillage, j'ai améliorer mon code
IE à un réglage par défaut du line-height
Il faut donc modifier ce réglage par défaut, je l'ai mis à 0
Maintenant IE et FF restituent bien la même chose
J'espère que cela servira à quelqu'un de débutant
Si vous avez des critiques à apporter, je suis ouvert à vos conseils 
.menu {
margin-left: 3px;
margin-right: 5px;
margin-top: 55px;
font-family: Times, Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
text-align: center;
}
.menu_cote li {
margin-bottom: 10px; /* espace entre les lignes du menu */
line-height: 0px; /* il faut changer les réglages par défaut de IE */
}
.menu_cote li {
margin-bottom: 10px; /* espace entre les lignes du menu */
line-height: 0px;
}
.menu_cote a {
text-decoration: none;
font-weight: bold;
font-style: none;
line-height: 15px; /* espace entre les interlignes (retour chariot automatique)*/
}
A remarquer que je dois jouer entre : margin-bottom de "menu_cote li" et line-height "menu_cote a" pour arriver à faire un réglage satisfaisant.
En effet, le line-height de "menu_cote a" n'agit pas seulement sur les interlignes mais aussi sur les saut de lignes, il suffit donc de corriger en réduisant un peu la valeur du margin-bottom de "menu_cote li"
Encore merci pour tes conseils Gatsusat
Message édité par aragorns le 01-09-2005 à 11:02:55
---------------
Membre d'honneur du CLUB DOROTHEE (abonné à Dorothée magazine depuis 1978). Directeur honnoraire de l'association "Sauvez Bernard Minet" (plus connue sous le nom de Bernard's Mined Club).
Sujets relatifs:
- [RESOLU] Sessions - Quand variable vide
- [RESOLU]XML-Actionscript le retour
- [RESOLU]Problème clips dynamiques et assignation...
- Reduire
- [Résolu]Batch et raccourci clavier
- [.net][c++] concat une textbox et une string[resolu] merci haazheel
- [Resolu] structure C++ vers structure C
- css et modèle font pas bon ménage... [Résolu]
- [Java JMF] <résolu> Un player qui passe à null tout seul...
- [Résolu][VBA] Form_Load ne se lance pas au chargement
Marsh Posté le 29-08-2005 à 22:04:37
Comment réduire les interlignes en css ?
J'aimerai que quand il y a un retour chariot automatique causé par une trop grande longueur de mon lien de menu, mes interlignes soient paramètrables
Pour l'instant, la distance entre les interlignes de retour chariots sont les mêmes que celles des <li>
Voici un extrès de mon code :
<div id="conteneur_menu">
<div id="gauche">
<div class="menu">
<li><a href="http://www.site.com">Accueil</a></li>
<li><a href="http://www.site.com">Pour qui est-ce ?</a></li>
<li><a href="http://www.site.com">Prise de conscience</a></li>
</div></div></div>
Mes CSS :
.menu {
list-style-type: none;
padding: 15px;
margin-left: 7px;
margin-right: 5px;
margin-top: 50px;
margin-bottom: 20px;
font-family: Times, Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 180%;
text-align: center;
}
Merci
Message édité par aragorns le 01-09-2005 à 11:03:28
---------------
Membre d'honneur du CLUB DOROTHEE (abonné à Dorothée magazine depuis 1978). Directeur honnoraire de l'association "Sauvez Bernard Minet" (plus connue sous le nom de Bernard's Mined Club).