transform: translate is compatible with which browsers?

Navigation
2

Usage example works well in modern browsers the doubt is in which versions it will not be compatible. 

<h2 style="position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%); color:orange;">Centralizado</h2>
    
asked by anonymous 22.03.2018 / 16:54

2 answers

1

According to MDN: link 

+---------------+---------------+----------------------------+-------------------+---------------+------------+
| Feature       | Chrome        | Firefox (Gecko)            | Internet Explorer | Opera         | Safari     |
+---------------+---------------+----------------------------+-------------------+---------------+------------+
| Basic support | (Yes) -webkit | 3.5 (1.9.1)-moz16.0 (16.0) | 9.0 -ms10.0       | 10.5-o12.5    | 3.1-webkit |
+---------------+---------------+----------------------------+-------------------+---------------+------------+
| 3D Support    | 12.0-webkit   | 10.0-moz16.0 (16.0)        | 10.0              | Não suportado | 4.0-webkit |
+---------------+---------------+----------------------------+-------------------+---------------+------------+

Note that for some versions you need to use -XXXX (ex: -webkit)

    
22.03.2018 / 17:03
3

According to CanIUse.com, this is the current situation:

Notethatthischartisfrom2DTransformsasawhole,whichincludestranslate.

Itemsmarkedwith[1]donotsupportCSSTransforminSVG

Still,youhavetonotethis:

  • BelowFF42,transform-origindoesnotworkinSVGeither.InIE9thecaretofatextareadisappearswhenyouusetranslate.

  • InAndroid2.3thescaledoesnotaffectbackground.

Link:

  

link

    
22.03.2018 / 17:00
Organization of PHP code Convert RGB to Hexadecimal with JavaScript