[CSS] Texte vertical sous Firefox
Résolu/Fermé
afrodje
Messages postés
759
Date d'inscription
mardi 13 mars 2007
Statut
Membre
Dernière intervention
22 janvier 2014
-
5 oct. 2009 à 16:35
Internet - 16 nov. 2009 à 17:23
Internet - 16 nov. 2009 à 17:23
A voir également:
- [CSS] Texte vertical sous Firefox
- Excel cellule couleur si condition texte - Guide
- Transcription audio en texte word gratuit - Guide
- Video downloadhelper firefox - Télécharger - Outils pour navigateurs
- Firefox telecharger - Télécharger - Navigateurs
- Adèle consulte son compte sur le site de sa banque et obtient l'affichage ci-dessous. complétez le texte. - Forum Facebook
3 réponses
afrodje
Messages postés
759
Date d'inscription
mardi 13 mars 2007
Statut
Membre
Dernière intervention
22 janvier 2014
168
6 oct. 2009 à 14:41
6 oct. 2009 à 14:41
Merci pour ton code.
Mais si c'est compatible uniquement pour IE, ca ne vaut pas le coup.
Le navigateur le plus utilisé est Firefox donc je ne peux pas passer outre ce navigateur.
Merci quand même, je garde ton code au cas où.
Mais si c'est compatible uniquement pour IE, ca ne vaut pas le coup.
Le navigateur le plus utilisé est Firefox donc je ne peux pas passer outre ce navigateur.
Merci quand même, je garde ton code au cas où.
C'est fait avec du CSS (feuille de styles) et exclusivement compatible avec IE, aucun autre navigateur ne supporte le texte vertical. Bien que se soit une recommendation très importante de la W3C pour les languages écrit verticalement bien sûr. Note que IE ne respecte pas vrament cette recomendation!
"CSS3 Text Module" (http://www.w3.org/TR/2003/CR-css3-text-20030514/#writing-mode)
Le truc c'est la propriété "writing-mode" à mettr à "tb-rl" c'est à dire Top to bottom et right to left.
<div style="writing-mode:tb-rl;">Texte vertical</div>
Avec IE, encore, tu peux inverser le texte en y appliquant un filtre (flipH() flipV();) qui n'a absolument rien à voir avec le CSS.
<div style="writing-mode:tb-rl;filter:flipH() flipV();">Texte vertical</div>
Mais une fois se filtre ajouté, IE ignore le "rl" (right to left) et gère comme par défaut un "lr" (left to right). Tu dois donc spécifier une position "absolue" et ajouter un style si tu veux le positionner à droite.
<div style="position:absolute;right:10px;writing-mode:tb-rl;filter:flipH() flipV();">Texte vertical</div>
Maintenant, reste quelques détails comme la hauteur (par défaut il "wrap").
<div style="width:20px;position:absolute;right:10px;writing-mode:tb-rl;filter:flipH() flipV();">Texte vertical</div>
Avec une classe :
<style type="text/css" >
#twTexteVertical {
position : absolute;
color : #666;
background : #fff;
right : 10px;
width : 20px;
writing-mode : tb-rl;
filter: flipH() flipV();
}
</style>
<div id="twTexteVertical">Texte vertical</div>
"CSS3 Text Module" (http://www.w3.org/TR/2003/CR-css3-text-20030514/#writing-mode)
Le truc c'est la propriété "writing-mode" à mettr à "tb-rl" c'est à dire Top to bottom et right to left.
<div style="writing-mode:tb-rl;">Texte vertical</div>
Avec IE, encore, tu peux inverser le texte en y appliquant un filtre (flipH() flipV();) qui n'a absolument rien à voir avec le CSS.
<div style="writing-mode:tb-rl;filter:flipH() flipV();">Texte vertical</div>
Mais une fois se filtre ajouté, IE ignore le "rl" (right to left) et gère comme par défaut un "lr" (left to right). Tu dois donc spécifier une position "absolue" et ajouter un style si tu veux le positionner à droite.
<div style="position:absolute;right:10px;writing-mode:tb-rl;filter:flipH() flipV();">Texte vertical</div>
Maintenant, reste quelques détails comme la hauteur (par défaut il "wrap").
<div style="width:20px;position:absolute;right:10px;writing-mode:tb-rl;filter:flipH() flipV();">Texte vertical</div>
Avec une classe :
<style type="text/css" >
#twTexteVertical {
position : absolute;
color : #666;
background : #fff;
right : 10px;
width : 20px;
writing-mode : tb-rl;
filter: flipH() flipV();
}
</style>
<div id="twTexteVertical">Texte vertical</div>
>Le navigateur le plus utilisé est Firefox donc je ne peux pas passer outre ce navigateur.
Non, pas vraiment.
https://www.pc-infopratique.com/actualite-3725-parts-de-marche-des-navigateurs-internet-en-2009.html
Non, pas vraiment.
https://www.pc-infopratique.com/actualite-3725-parts-de-marche-des-navigateurs-internet-en-2009.html
