[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
Bonjour,
Je cherche à mettre du texte en vertical mais sous Firefox.
Le code suivant fonctionne sous IE mais pas sous firefox :
Merci de votre aide.
Je cherche à mettre du texte en vertical mais sous Firefox.
Le code suivant fonctionne sous IE mais pas sous firefox :
writing-mode: tb-rl;
Merci de votre aide.
A voir également:
- [CSS] Texte vertical sous Firefox
- Texte de chanson gratuit pdf - Télécharger - Vie quotidienne
- Telecharger firefox - Télécharger - Navigateurs
- Excel cellule couleur si condition texte - Guide
- Video downloadhelper firefox - Télécharger - Outils pour navigateurs
- Transcription audio en texte word gratuit - Guide
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
