All geek questions in one place

The difference between conversion: translation and position: relative ;?

As the name says, what are the differences between transform: translate (x, y) and position: relative.

Since they both do the same thing (position elements) in any case, how do they differ in purpose and application?

I read an article on centering elements using "transform: translate"; it’s better to use “conversion” due to GPU and optimization considerations, but I really don’t see the problem, since it’s not very important if you just rearrange the element and not animate it.

So, in the end, how do they differ from each other and how?

+6
source share
1 answer

Basically, translate relies on CSS3 2D Transforms , and the position property is on the CSS2 level .

In a browser that supports, it was said that using translate will increase the entire graphical form of the browser,

but not all browsers support it,

so if you want to provide broad browser support, the CSS2 position is definitely better

transform:translate() is the future.

+2
source

Source: https://habr.com/ru/post/981401/

More articles:


All Articles