Indice et exposant en css ? [Résolu/Fermé]

Signaler
Messages postés
67
Date d'inscription
mardi 30 octobre 2007
Statut
Membre
Dernière intervention
17 septembre 2016
-
Messages postés
12
Date d'inscription
dimanche 31 octobre 2010
Statut
Membre
Dernière intervention
9 juin 2017
-
Bonjour,

Comment peut on faire pour mettres les indices (en bas de lettre petite taille) et les exposants (en haut de lettre petite taille) ?
Balise xhtml ou style css ?

Je n'aime pas la balise <sup> parce qu'elle me décale mes interlignes d'un demi point. créant une interligne de 1 et demi.
Y a t'il d'autres balises html ?

Et en css, quelle classe peut on créer ? Si ça existe....

Namasté
Yv

9 réponses

Messages postés
4606
Date d'inscription
lundi 7 novembre 2005
Statut
Contributeur
Dernière intervention
24 octobre 2020
1 278
Comment peut on faire pour mettres les indices (en bas de lettre petite taille)

<sub>

et les exposants (en haut de lettre petite taille) ?

<sup>

Je n'aime pas la balise <sup> parce qu'elle me décale mes interlignes d'un demi point. créant une interligne de 1 et demi. Y a t'il d'autres balises html ?

non

Et en css, quelle classe peut on créer ? Si ça existe....

SMALL, SUB, SUP { font-size: .83em } /*tu dois pouvoir jouer avec les propriétés d'interligne et de dimension des lignes ici*/
SUB { vertical-align: sub }
SUP { vertical-align: super }
20
Merci

Quelques mots de remerciements seront grandement appréciés. Ajouter un commentaire

CCM 76687 internautes nous ont dit merci ce mois-ci

en fait je ne vois pas pourquoi il faut creer un class .sup, quand on peut directement faire un style pour <sup>

par ex.
sup {
font-size: .7em;
line-height: .8em;
}

ciao, n
Messages postés
67
Date d'inscription
mardi 30 octobre 2007
Statut
Membre
Dernière intervention
17 septembre 2016
9
Donc en css, il suffit de créer une class .sup, dans laquelle tu indiques [vertical-align: super;] pour l'indice exposant, et tu l'appliques aux termes que tu veux en exposant.

Par exemple tu peux faire la class css suivante :

.sup { vertical-align: super; font-size: 50%; }

Entre les accolades tu mets toutes les propriétés que tu veux : taille, police, écartement, couleurs, etc...)

Om
Yv
Messages postés
12
Date d'inscription
dimanche 31 octobre 2010
Statut
Membre
Dernière intervention
9 juin 2017
1
Avec vertical-align:text-top pour sup dans la feuille de style, il n'y a plus de souci pour la hauteur de l'interligne, puisque le haut de l'exposant a le même plafond que le reste du texte : il est juste collé au plafond, avec une hauteur et une police plus petite.
Messages postés
67
Date d'inscription
mardi 30 octobre 2007
Statut
Membre
Dernière intervention
17 septembre 2016
9
A super, j'essaie le css
Merci
Yv
Messages postés
67
Date d'inscription
mardi 30 octobre 2007
Statut
Membre
Dernière intervention
17 septembre 2016
9
Ouaip ça marche

Merci gryzzly
Om
Yv
Messages postés
4606
Date d'inscription
lundi 7 novembre 2005
Statut
Contributeur
Dernière intervention
24 octobre 2020
1 278
Super. Tu peux donner la solution exacte pour les suivants ?
Messages postés
180
Date d'inscription
mercredi 30 mai 2007
Statut
Membre
Dernière intervention
21 février 2011
36
Bonjour
Je suis d'accord avec nicomo. Etant donné que l'annotation fait partie de la structure du texte, il est justifié et je pense même préférable d'utiliser la balise correspondante. Utiliser par exemple un <span class="sup"> laisserait entendre qu'on considère la notation en exposant comme de la pure présentation. Ce n'est pas pour rien que cette balise est présente en xhtml.
Messages postés
3571
Date d'inscription
mercredi 20 septembre 2006
Statut
Membre
Dernière intervention
21 novembre 2020
793
Oui, mais comme le spécifiait la demande initiale : «Je n'aime pas la balise <sup> parce qu'elle me décale mes interlignes d'un demi point. créant une interligne de 1 et demi. »
Messages postés
6728
Date d'inscription
mardi 14 mai 2002
Statut
Contributeur
Dernière intervention
11 janvier 2016
897 >
Messages postés
3571
Date d'inscription
mercredi 20 septembre 2006
Statut
Membre
Dernière intervention
21 novembre 2020

salut,

c'est une balise donc tu peux tout définir avec CSS, pas la peine d'utiliser un <span> et une classe, d'autant plus que comme ça tu ne perd pas la valeur sémantique de <sup>.

Bonjour

Merci pour toutes ces infos mais malgré ça j'ai quand même un problème !

si je donne une valeur supérieur à .50em à mon exposant, il augmente mon interligne
j'ai bien précisé dans la css de mon bloc texte : line-height...
et : .sup{vertical-align: sup; dans ma class

Mon exposant n'est pas assez voyant il faudrait que j'augmente sa taille sans qu'il n'y est de modification d'interligne

pourriez-vous, svp, me dire quoi faire ?
Messages postés
9
Date d'inscription
dimanche 29 novembre 2009
Statut
Membre
Dernière intervention
1 août 2011

Non, non et non.

1. Non, parce que tous les tous les chiffres sont disponibles. Cependant, les chiffres de 4 à 0 ne sont pas placés au même endroit dans Unicode (vous utilisez Unicode n'est-ce pas ? Vous n'êtes pas resté au XXe siècle ?)

La liste est ici, avec exposants et indices
http://www.fileformat.info/info/unicode/category/No/list.htm

¹²³????????????????

(horreur : commentcamarche.net n'utilise même pas Unicode. Les gars, ça ne fait pas sérieux - Unicode remonte à 1990 ! - après le 3 en exposants, vous êtes censés voir les autres exposants suivis des indices)

2. Non parce que caractères Unicode ne sont pas conçus pour être utilisés, mais pour être compatibles avec l'existant. Il existe par exemple des caractères Unicode pour les chiffres romains, mais il ne sont pas conçus pour être utilisés dans de nouveaux documents, mais juste pour permettre à d'anciens documents d'être lus (pour un chiffre romain, on recommande ainsi d'utiliser le ou les caractères latins correspondants (I, II, III, IV...), quand bien même le chiffre romain existe dans Unicode (?,?,?,?...

3. Non parce que faire ainsi amène à deux poids deux mesures : pour les chiffres, vous utilisez les caractères Unicode et pour les lettres, mmh ? Et voilà, vous vous retrouvez à devoir mélanger de caractères d'exposant et des CSS, au lieu d'utiliser des CSS partout (vu qu'il est impossible d'utiliser des caractères d'exposant partout).

En espérant avoir êté utile.
oh cool c'est pas la peine de t'enflammer comme ça. j'ai dreamweaver et je fais avec, je me suis pas placé en spécialiste non plus.
bon j'ai trouvé ça que je vais finalement utiliser pour mes exposants :

dans la CSS :

sup {

valign: super;
font-size: 70%;
line-height: 80%;
}

l'interlignage n'est pas affecté et le chiffre se décroche mieux.
ça fait XXI ème siècle là ?
Messages postés
9
Date d'inscription
dimanche 29 novembre 2009
Statut
Membre
Dernière intervention
1 août 2011

C'est parfait, c'est la même méthode que j'utilise. J'utilise des valeurs différentes (line-height:80%;
font-size:82%) avec un résultat mitigé, car j'ai l'impression que l'on est un peu dépendant du navigateur, de la taille de police, de l'interlignage...

Dis-moi : peux-tu tester si le rendu est le même avec 1) une font-size à 200 % 2) une line-height à 1.4em (par exemple) 3) une autre police ? 4) une autre navigateur ?

Car j'ai la désagréable impression qu'il faut bidouiller au cas par cas.

Merci de tes retours :)

P.-S. : ma remarque sur le XXIe siècle était un trait d'humour. Je suis désolé si ça a été mal interprété
P.-P.-S. : en fait, tout mon message était plus désagréable que je le souhaitais. Je ne m'en suis pas rendu compte, je suis confus.
c facile, dans traitement de texte
il y a une ecriture EXPOSANT
Messages postés
9
Date d'inscription
lundi 12 novembre 2007
Statut
Membre
Dernière intervention
5 août 2015
3
Un autre inconvénient de <sup> se rencontre dans les ebooks : les Kobo - qui sont quand même assez répandus - ne l'affichent pas correctement en exposant. Cela fait des petits caractères sur la ligne de base. Même chose sur les Kobo pour vertical-align:top dans les feuilles de style, qu'on doit remplacer par vertical-align:super.