Exposant en CSS

Bonjour,

J'ai fait pas mal de recherches sur le net pour savoir comment placer un exposant sur mon site (le petit chiffre comme 2m2 (carré).

J'ai trouvé la solution :

<sub>2</sub>

Le problème est que j'ai un lien sur ce "2", donc du coup j'ai bien l'exposant mais le style des liens de tout le site s'applique aussi sur ce "2".

Alors, je suis passée au CSS.

J'ai mis :

<span class="exposant">2</span>

Et dans le CSS :

.exposant {
position: relative;
bottom: 1px;
font-size: .8em;
line-height: .8em;
vertical-align:super;
text-decoration:none;
}

Mais comment je peux ici changer le lien, au survol et après ? Car je l'ai déjà fait pour les liens globales du site mais là juste pour le "exposant" je sais pas faire.

Je suis sure que c'est tout simple et que vous ne mettrez pas longtemps à m'aider, car malgré mes testes pas de résultats

Bonjour,

Déjà un exposant c'est avec <sup>, pas <sub>. Faute de frappe, je suppose?
Ensuite, pourquoi basculer sur un <span class="machin">? Si on a besoin d'une classe pour identifier un usage précis de <sup>, on peut écrire <sup class="machin">.
Enfin, je n'ai pas bien compris quel était le problème initial ni les problèmes rencontrés avec la solution trouvée, donc je m'abstiendrai de commentaires pour l'instant.

Bonjour Florent,

Merci pour ta réponse. Oui pardon, faute de frappe !

Je passe à un <span class="machin"> comme tu dis car cela me permet de pouvoir définir la hauteur de l'exposant.

Le problème est que le lien appliqué au numéro "2" n'est pas comme je le voudrais, je voudrais qu'il soit d'une couleur de base, d'une autre au survol, non souligné... tout ça bien sûr dans le code en dessous, et je ne sait pas faire

.exposant {

position: relative;

bottom: 1px;

font-size: .8em;

line-height: .8em;

vertical-align:super;

text-decoration:none;

}

Lilianne a écrit :
Je passe à un <span class="machin"> comme tu dis car cela me permet de pouvoir définir la hauteur de l'exposant.

Ce que SUP ne permettrait pas de faire? Va falloir réviser les CSS. C'est comme si tu disais «j'utilise <div class="titre"> au lieu de <h2> car cela me permet de définir la taille du texte».

Lilianne a écrit :
Le problème est que le lien appliqué au numéro "2" n'est pas comme je le voudrais, je voudrais qu'il soit d'une couleur de base, d'une autre au survol, non souligné...

Pour cela il suffit de définir le style des liens (élément A), non?
Modifié par Florent V. (14 Jun 2010 - 14:43)