Quel CSS remplace la balise <sup> ?

Répondre


Cette question est un moyen d’empêcher des soumissions automatisées de formulaires par des robots.
Smileys
:D :) :( :o :shock: :? 8-) :lol: :x :P :oops: :cry: :evil: :twisted: :roll: :wink: :!: :?: :idea: :arrow: :| :mrgreen: =D> #-o =P~ :^o :non: :priere: 8-|
Voir plus de smileys
  Revue du sujet
 

  Étendre la vue Revue du sujet : Quel CSS remplace la balise <sup> ?

Re: Quel CSS remplace la balise <sup> ?

par Cyrano » 09 nov. 2012, 00:24

Marrant que ce sujet remonte après plus de 7ans1/2.

En le relisant, je réalise que bien des choses ont évolué en matière de formatage de texte. Et aujourd'hui, je déconseillerais de remplacer une balise <sup> par un style CSS. Pourquoi ? Parce que c'est de la sémantique et qu'un exposant est un élément de texte au même titre que tout autre élément et que cette balise est précisément conçue spécialement pour cet usage.

« Le mieux est l'ennemi du bien », et en l'occurrence, ce type d'amélioration n'en est pas une, sans compter, à mon sens, que ça complique plus qu'autre chose.

my 2¢

Re: Quel CSS remplace la balise <sup> ?

par mypoorlugar » 08 nov. 2012, 22:38

J’ai tenté à l’instant ceci:

Code : Tout sélectionner

sup {font-size:77.78%; vertical-align:22.22%;}
Fonctionnel sous Firefox et accepté par le validateur css du w3c.
Il est donc possible de garder <sup></sup> et de choisr les proportions.

par flitox » 31 mars 2005, 14:41

Mais si tu en es au début de ton développement, modifie ta base, tu gagneras du temps pour plus tard ;)
Certes, certes... mais cela ne nous interdit pas de le brûler, au moins ? :mrgreen:

Faut m'comprendre, ça fait plus de 48 heures que je me bats sur un même bug, alors forcément, j'm'énerve un peu...
Je dis ça mais je dis rien :roll:

:lol:

par albat » 31 mars 2005, 14:32

Barbares ! [-(

par flitox » 31 mars 2005, 13:58

On ne peut pas juste lui brûler les doigts de pied? allez juste un...

par Cyrano » 31 mars 2005, 13:54

Je ne serai pas brûlé vif, au moins ?
On attendra que tu sois un peu mort, on est pas des sauvages :langue:

par albat » 31 mars 2005, 13:45

Donc, il est tout à fait normalement de procéder en deux étapes,
cad de remplacer la balise <sup> par deux propriétés CSS.

En soi, ce n'est pas fondamentalement gênant
mais c'est tout de même dommage de ne pas avoir implémenté
une propriété du genre font-style:sup;

Merci !

Je ne serai pas brûlé vif, au moins ? :lol:

par Cyrano » 31 mars 2005, 13:36

Une petite recherche aurait pu te faire trouver CECI :langue:
C'est donc bien du style CSS propre et en ajoutant une taille de police appropriée, tu obtiens le résultat souhaité: pour la taille de police, au lieu de fixer la taille en px ou en pt, tu peux utiliser une taille relative: {font-size: smaller} qui va diminuer la taille par rapport à la taille normale de l'élément dans lequel se trouve ton exposant.

par flitox » 31 mars 2005, 12:58

Tu as du écrire en même temps car je t'ai proposé le même bricolage juste en haut ;)

par albat » 31 mars 2005, 12:56

J'ai bricolé un peu en créant le style suivant :
.noteRenvoi
  { font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:8px;  // mon texte courant est en 12px
    font-weight:bold;
    vertical-align:super;
  }
Ça marche au poil, mais je pensais qu'il existait une équivalence stricte en CSS
à la balise <sup> qui aurait pu réunir tous ses effets en une seule propriété.

[edit] Les grands esprits se rencontrent : messages postés simultanément. :lol:

par flitox » 31 mars 2005, 12:55

Pour l'instant la seule chose qui me vienne à l'esprit serait :

Code : Tout sélectionner

2<span style="font-size: 9px; vertical-align: super">8</span>
Ca a bien la taille d'un exposant comme avec <sup></sup> mais c'est probablement barbare comme méthode :wink:

par albat » 31 mars 2005, 12:52

Merci ! :)
C'est en effet beaucoup mieux... mais c'est hélas incomplet. :(

La balise <sup> a deux effets :
- décalage du texte vers le haut
- réduction du corps (taille des caractères)
et cette propriété CSS ne réalise que le premier effet.

On n'est pas loin... Je sens qu'on n'est pas loin... :wink:
Merci !

par flitox » 31 mars 2005, 12:42

Yopla boum ! ;)

Code : Tout sélectionner

2<span style="vertical-align: super">8</span>

Quel CSS remplace la balise <sup> ?

par albat » 31 mars 2005, 12:21

Une fois encore, tout est dans le titre :
Par quelle propriété CSS puis-je remplacer la balise <sup>...</sup> ? :?:
Merci !

NB : La propriété vertical-align:sup; indiquée sur http://yansanmo.no-ip.org:8080/a/tutxhtml07 ne fonctionne pas.