Je confirme après vérification que tout est à la fois très simple et très logique, et que tous les exemples de ta page sont conformes aux attentes. Pour chaque élément, tu fais les choses suivantes :
1) calculer la valeur de text-transform (none, lowercase, uppercase ou capitalize).
2) calculer la valeur de font-variant (normal ou small-caps).
(Note : les étapes 1 et 2 sont indépendantes et peuvent être effectuées dans l'autre sens)
3) Pour chaque lettre de l'élément, tu regardes en fonction de sa valeur initiale et de text-transform (sans tenir compte de font-variant) si c'est une majuscule ou une minuscule.
4) Si c'est une majuscule, inutile de regarder le font-variant.
5) Si c'est une minuscule, le font-variant dira s'il faut ou non la dessiner sous la forme d'une petite capitale. Rappel : même sous forme de petite capitale, cela reste typographiquement une minuscule.
Et hop !
Le 08/09/2008 15:59, SAM a écrit :
<http://cjoint.com/?jipEg8lkyl>
Je confirme après vérification que tout est à la fois très simple et
très logique, et que tous les exemples de ta page sont conformes aux
attentes. Pour chaque élément, tu fais les choses suivantes :
1) calculer la valeur de text-transform (none, lowercase, uppercase ou
capitalize).
2) calculer la valeur de font-variant (normal ou small-caps).
(Note : les étapes 1 et 2 sont indépendantes et peuvent être effectuées
dans l'autre sens)
3) Pour chaque lettre de l'élément, tu regardes en fonction de sa valeur
initiale et de text-transform (sans tenir compte de font-variant) si
c'est une majuscule ou une minuscule.
4) Si c'est une majuscule, inutile de regarder le font-variant.
5) Si c'est une minuscule, le font-variant dira s'il faut ou non la
dessiner sous la forme d'une petite capitale. Rappel : même sous forme
de petite capitale, cela reste typographiquement une minuscule.
Je confirme après vérification que tout est à la fois très simple et très logique, et que tous les exemples de ta page sont conformes aux attentes. Pour chaque élément, tu fais les choses suivantes :
1) calculer la valeur de text-transform (none, lowercase, uppercase ou capitalize).
2) calculer la valeur de font-variant (normal ou small-caps).
(Note : les étapes 1 et 2 sont indépendantes et peuvent être effectuées dans l'autre sens)
3) Pour chaque lettre de l'élément, tu regardes en fonction de sa valeur initiale et de text-transform (sans tenir compte de font-variant) si c'est une majuscule ou une minuscule.
4) Si c'est une majuscule, inutile de regarder le font-variant.
5) Si c'est une minuscule, le font-variant dira s'il faut ou non la dessiner sous la forme d'une petite capitale. Rappel : même sous forme de petite capitale, cela reste typographiquement une minuscule.
Et hop !
SAM
Olivier Miakinen a écrit :
Le 08/09/2008 17:18, SAM a écrit :
Rien n'vaut les tests :
Tu peux donc facilement vérifier que toutes les définitions suivantes sont équivalentes :
(...)
Résultat attendu : MAJUSCULES Minuscules
Même pas besoin :-)
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en imbriqué, on puisse avoir des modif successives, au lieu de : 'c'est le dernier qui l'emporte'.
<div class="minus"> là à ce stade tout est en minuscules <p class="capital"> Ici On Serait En Capitalisation Sans Maj Intermédiaires <span class="petites">Capitalisation Et Tout En Majuscules</span> </p> </div>
ou alors : .minus { text-transform: lowercase } .minus < .capital { text-transform: capitalize; }
Bon yaka faire attention à ce qu'on tape, ou alors le faire faire à une dactylo.
-- sm
Olivier Miakinen a écrit :
Le 08/09/2008 17:18, SAM a écrit :
Rien n'vaut les tests :
Tu peux donc facilement vérifier que toutes les définitions suivantes
sont équivalentes :
(...)
Résultat attendu : MAJUSCULES Minuscules
Même pas besoin :-)
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en
imbriqué, on puisse avoir des modif successives, au lieu de :
'c'est le dernier qui l'emporte'.
<div class="minus">
là à ce stade tout est en minuscules
<p class="capital">
Ici On Serait En Capitalisation Sans Maj Intermédiaires
<span class="petites">Capitalisation Et Tout En Majuscules</span>
</p>
</div>
Tu peux donc facilement vérifier que toutes les définitions suivantes sont équivalentes :
(...)
Résultat attendu : MAJUSCULES Minuscules
Même pas besoin :-)
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en imbriqué, on puisse avoir des modif successives, au lieu de : 'c'est le dernier qui l'emporte'.
<div class="minus"> là à ce stade tout est en minuscules <p class="capital"> Ici On Serait En Capitalisation Sans Maj Intermédiaires <span class="petites">Capitalisation Et Tout En Majuscules</span> </p> </div>
ou alors : .minus { text-transform: lowercase } .minus < .capital { text-transform: capitalize; }
Bon yaka faire attention à ce qu'on tape, ou alors le faire faire à une dactylo.
-- sm
Olivier Miakinen
Le 08/09/2008 18:46, SAM a écrit :
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en imbriqué, on puisse avoir des modif successives, au lieu de : 'c'est le dernier qui l'emporte'.
Ben oui, mais ce serait contraire aux règles de cascade de CSS. C'est comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
<div class="minus"> là à ce stade tout est en minuscules <p class="capital"> Ici On Serait En Capitalisation Sans Maj Intermédiaires <span class="petites">Capitalisation Et Tout En Majuscules</span> </p> </div>
Note que ce cas ne *devrait* pas se poser, car la plupart des « majuscules » contenues dans ce code HTML sont des fautes d'orthographe. On ne saurait reprocher à CSS de ne pas savoir corriger les fautes d'orthographe contenues dans le HTML !
Voir par exemple cet excellent article qui explique bien la différence entre les majuscules (qui relèvent de l'orthographe) et les petites capitales (qui relèvent de la typographie) : http://marcautret.free.fr/sigma/pratik/typo/majcaps/
¹ Elle est belle ma MÀLC elle est belle !
-- Olivier Miakinen
Le 08/09/2008 18:46, SAM a écrit :
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en
imbriqué, on puisse avoir des modif successives, au lieu de :
'c'est le dernier qui l'emporte'.
Ben oui, mais ce serait contraire aux règles de cascade de CSS. C'est
comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu
voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
<div class="minus">
là à ce stade tout est en minuscules
<p class="capital">
Ici On Serait En Capitalisation Sans Maj Intermédiaires
<span class="petites">Capitalisation Et Tout En Majuscules</span>
</p>
</div>
Note que ce cas ne *devrait* pas se poser, car la plupart des
« majuscules » contenues dans ce code HTML sont des fautes
d'orthographe. On ne saurait reprocher à CSS de ne pas savoir
corriger les fautes d'orthographe contenues dans le HTML !
Voir par exemple cet excellent article qui explique bien la
différence entre les majuscules (qui relèvent de l'orthographe)
et les petites capitales (qui relèvent de la typographie) :
http://marcautret.free.fr/sigma/pratik/typo/majcaps/
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en imbriqué, on puisse avoir des modif successives, au lieu de : 'c'est le dernier qui l'emporte'.
Ben oui, mais ce serait contraire aux règles de cascade de CSS. C'est comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
<div class="minus"> là à ce stade tout est en minuscules <p class="capital"> Ici On Serait En Capitalisation Sans Maj Intermédiaires <span class="petites">Capitalisation Et Tout En Majuscules</span> </p> </div>
Note que ce cas ne *devrait* pas se poser, car la plupart des « majuscules » contenues dans ce code HTML sont des fautes d'orthographe. On ne saurait reprocher à CSS de ne pas savoir corriger les fautes d'orthographe contenues dans le HTML !
Voir par exemple cet excellent article qui explique bien la différence entre les majuscules (qui relèvent de l'orthographe) et les petites capitales (qui relèvent de la typographie) : http://marcautret.free.fr/sigma/pratik/typo/majcaps/
¹ Elle est belle ma MÀLC elle est belle !
-- Olivier Miakinen
SAM
Olivier Miakinen a écrit :
Le 08/09/2008 18:46, SAM a écrit :
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en imbriqué, on puisse avoir des modif successives, au lieu de : 'c'est le dernier qui l'emporte'.
Ben oui, mais ce serait contraire aux règles de cascade de CSS. C'est comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
ho! qu'elle est bonne c't'idée ! plus besoin de filter ni d'opacity sur 2 éléments que de toutes façons ça fait ce que ça veut <http://cjoint.com/?jiuYjN1TzC>
Tu t'occupes quand du W3C ?
<div class="minus"> là à ce stade tout est en minuscules <p class="capital"> Ici On Serait En Capitalisation Sans Maj Intermédiaires <span class="petites">Capitalisation Et Tout En Majuscules</span> </p> </div>
Note que ce cas ne *devrait* pas se poser, car la plupart des « majuscules » contenues dans ce code HTML sont des fautes d'orthographe.
Ha! v'là que ça l'reprend ! Et si on a envie de fayoter(*) son Président(*) ?
Voir par exemple cet excellent article : http://marcautret.free.fr/sigma/pratik/typo/majcaps/
Pas mal :-) et pas fini m'a pas dit comment en CSS avoir 'Victor Hugo' en capitalisation et majuscules rouges
(*) en américanisant sa prose (*) non ce n'est pas le fromage ! -- sm
Olivier Miakinen a écrit :
Le 08/09/2008 18:46, SAM a écrit :
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en
imbriqué, on puisse avoir des modif successives, au lieu de :
'c'est le dernier qui l'emporte'.
Ben oui, mais ce serait contraire aux règles de cascade de CSS. C'est
comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu
voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
ho! qu'elle est bonne c't'idée !
plus besoin de filter ni d'opacity sur 2 éléments
que de toutes façons ça fait ce que ça veut
<http://cjoint.com/?jiuYjN1TzC>
Tu t'occupes quand du W3C ?
<div class="minus">
là à ce stade tout est en minuscules
<p class="capital">
Ici On Serait En Capitalisation Sans Maj Intermédiaires
<span class="petites">Capitalisation Et Tout En Majuscules</span>
</p>
</div>
Note que ce cas ne *devrait* pas se poser, car la plupart des
« majuscules » contenues dans ce code HTML sont des fautes
d'orthographe.
Ha! v'là que ça l'reprend !
Et si on a envie de fayoter(*) son Président(*) ?
Voir par exemple cet excellent article :
http://marcautret.free.fr/sigma/pratik/typo/majcaps/
Pas mal :-)
et pas fini
m'a pas dit comment en CSS avoir 'Victor Hugo'
en capitalisation et majuscules rouges
(*) en américanisant sa prose
(*) non ce n'est pas le fromage !
--
sm
C'est juste que j'aurais aimé un truc pour que, par exemple au moins en imbriqué, on puisse avoir des modif successives, au lieu de : 'c'est le dernier qui l'emporte'.
Ben oui, mais ce serait contraire aux règles de cascade de CSS. C'est comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
ho! qu'elle est bonne c't'idée ! plus besoin de filter ni d'opacity sur 2 éléments que de toutes façons ça fait ce que ça veut <http://cjoint.com/?jiuYjN1TzC>
Tu t'occupes quand du W3C ?
<div class="minus"> là à ce stade tout est en minuscules <p class="capital"> Ici On Serait En Capitalisation Sans Maj Intermédiaires <span class="petites">Capitalisation Et Tout En Majuscules</span> </p> </div>
Note que ce cas ne *devrait* pas se poser, car la plupart des « majuscules » contenues dans ce code HTML sont des fautes d'orthographe.
Ha! v'là que ça l'reprend ! Et si on a envie de fayoter(*) son Président(*) ?
Voir par exemple cet excellent article : http://marcautret.free.fr/sigma/pratik/typo/majcaps/
Pas mal :-) et pas fini m'a pas dit comment en CSS avoir 'Victor Hugo' en capitalisation et majuscules rouges
(*) en américanisant sa prose (*) non ce n'est pas le fromage ! -- sm
Olivier Miakinen
Le 08/09/2008 20:56, SAM a écrit :
comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
ho! qu'elle est bonne c't'idée ! plus besoin de filter ni d'opacity sur 2 éléments que de toutes façons ça fait ce que ça veut <http://cjoint.com/?jiuYjN1TzC>
Tu t'occupes quand du W3C ?
:-D
Note que ce cas ne *devrait* pas se poser, car la plupart des « majuscules » contenues dans ce code HTML sont des fautes d'orthographe.
Ha! v'là que ça l'reprend ! Et si on a envie de fayoter(*) son Président(*) ? (*) en américanisant sa prose
Je ne vois pas où est le problème : il suffit d'appliquer le capitalize à un texte orthographiquement et typographiquement correct, pour faire plaisir à son Boss.
Au contraire, si tu commençais par faire un lowercase sur le texte suivant, il en attraperait probablement une crise cardiaque : « Le directeur de la société McLaren, monsieur LaBonté, est arrivé au volant de sa DeLorean chez monsieur LaFayette, le grand patron américain du cinémaScope ».
Le 08/09/2008 20:56, SAM a écrit :
comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu
voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
ho! qu'elle est bonne c't'idée !
plus besoin de filter ni d'opacity sur 2 éléments
que de toutes façons ça fait ce que ça veut
<http://cjoint.com/?jiuYjN1TzC>
Tu t'occupes quand du W3C ?
:-D
Note que ce cas ne *devrait* pas se poser, car la plupart des
« majuscules » contenues dans ce code HTML sont des fautes
d'orthographe.
Ha! v'là que ça l'reprend !
Et si on a envie de fayoter(*) son Président(*) ?
(*) en américanisant sa prose
Je ne vois pas où est le problème : il suffit d'appliquer le capitalize
à un texte orthographiquement et typographiquement correct, pour faire
plaisir à son Boss.
Au contraire, si tu commençais par faire un lowercase sur le texte
suivant, il en attraperait probablement une crise cardiaque :
« Le directeur de la société McLaren, monsieur LaBonté, est arrivé
au volant de sa DeLorean chez monsieur LaFayette, le grand patron
américain du cinémaScope ».
comme si avec <div class="blue">bleu <p class="red">rouge</p></div> tu voulais que le texte à l'intérieur du paragraphe soit en violet¹ !
ho! qu'elle est bonne c't'idée ! plus besoin de filter ni d'opacity sur 2 éléments que de toutes façons ça fait ce que ça veut <http://cjoint.com/?jiuYjN1TzC>
Tu t'occupes quand du W3C ?
:-D
Note que ce cas ne *devrait* pas se poser, car la plupart des « majuscules » contenues dans ce code HTML sont des fautes d'orthographe.
Ha! v'là que ça l'reprend ! Et si on a envie de fayoter(*) son Président(*) ? (*) en américanisant sa prose
Je ne vois pas où est le problème : il suffit d'appliquer le capitalize à un texte orthographiquement et typographiquement correct, pour faire plaisir à son Boss.
Au contraire, si tu commençais par faire un lowercase sur le texte suivant, il en attraperait probablement une crise cardiaque : « Le directeur de la société McLaren, monsieur LaBonté, est arrivé au volant de sa DeLorean chez monsieur LaFayette, le grand patron américain du cinémaScope ».
Pierre Goiffon
Olivier Miakinen wrote:
J'ai été surpris par l'application d'un text-transform différent via 2 classes :
div div.minus, .minus dd { text-transform: lowercase } div div.capital, div p.capital, .capital dd { text-transform: capitalize }
class = minus capital
Me disant que l'un allait écraser l'autre...
C'est bien ce qui se passe : les deux règles ayant la même spécificité, c'est la dernière définie qui l'emporte (donc le capitalize l'emporte sur le lowercase).
Si je reprend la recommandation ce n'est pas très clair : http://www.w3.org/TR/CSS21/cascade.html#cascading-order On arrive au point 4, c'est donc le "order specified" qui va permettre de décider laquelle des 2 classes conserver. Oui mais... L'ordre dans la CSS ou dans l'attribut class ?
L'ordre dans la CSS. Pour moi c'est très clair.
Ok, merci Stéphane et Olivier de vos réponses ! Je note ce point à ajouter à une page sur mon site :) (parmi les 3 milliards de trucs en attente)
Olivier Miakinen wrote:
J'ai été surpris par l'application d'un text-transform différent via 2
classes :
div div.minus,
.minus dd { text-transform: lowercase }
div div.capital,
div p.capital,
.capital dd { text-transform: capitalize }
class = minus capital
Me disant que l'un allait écraser l'autre...
C'est bien ce qui se passe : les deux règles ayant la même spécificité,
c'est la dernière définie qui l'emporte (donc le capitalize l'emporte
sur le lowercase).
Si je reprend la
recommandation ce n'est pas très clair :
http://www.w3.org/TR/CSS21/cascade.html#cascading-order
On arrive au point 4, c'est donc le "order specified" qui va permettre
de décider laquelle des 2 classes conserver. Oui mais... L'ordre dans la
CSS ou dans l'attribut class ?
L'ordre dans la CSS. Pour moi c'est très clair.
Ok, merci Stéphane et Olivier de vos réponses ! Je note ce point à
ajouter à une page sur mon site :) (parmi les 3 milliards de trucs en
attente)
J'ai été surpris par l'application d'un text-transform différent via 2 classes :
div div.minus, .minus dd { text-transform: lowercase } div div.capital, div p.capital, .capital dd { text-transform: capitalize }
class = minus capital
Me disant que l'un allait écraser l'autre...
C'est bien ce qui se passe : les deux règles ayant la même spécificité, c'est la dernière définie qui l'emporte (donc le capitalize l'emporte sur le lowercase).
Si je reprend la recommandation ce n'est pas très clair : http://www.w3.org/TR/CSS21/cascade.html#cascading-order On arrive au point 4, c'est donc le "order specified" qui va permettre de décider laquelle des 2 classes conserver. Oui mais... L'ordre dans la CSS ou dans l'attribut class ?
L'ordre dans la CSS. Pour moi c'est très clair.
Ok, merci Stéphane et Olivier de vos réponses ! Je note ce point à ajouter à une page sur mon site :) (parmi les 3 milliards de trucs en attente)
