Je me heurte a un souic de rotation sur un html entity ®
Mon code HTML :
Code html : Sélectionner tout - Visualiser dans une fenêtre à part
<li class="m2 '.(($page==2 && $sub==1)?'active':'').'" data-family="B"><div class="txt-bt">Produit Marque&reg;</div></li>
le css:
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
 
.txt-bt {
	 height:160px;
	 writing-mode: tb-rl;
  	 color: #ffffff;
	 -size:20px;
	 -webkit-transform:rotate(-180deg);
         -moz-transform:rotate(-180deg);
         -ms-transform:rotate(-180deg);
         -o-transform:rotate(-180deg);
         transform:rotate(-180deg);
	padding: 10px;
	text-align: center;
	line-height: 25px;
	font-size: 15px;
	letter-spacing:3px;
	font-family: verdana;
  }
Une implémentation sur le fiddle

https://jsfiddle.net/un9Lvw3p/

Notez que le Reg est à l'envers ?????
Je en comprends vraiment pas

J'ai même essayé de coller le htmlentity dans un élément de class dédié et tenté d'annuler la rotation ou d'en rajouter une..; et bien nada il refuse de trourner.

Auriez vous des suggestions?