Shulou(Shulou.com)06/03 Report--

Xiaobian to share with you how to use css transform vertical alignment, I believe most people still do not know how, so share this article for everyone's reference, I hope you have a lot of harvest after reading this article, let's go to understand it together!

description

1. Use transform to align vertically from single-line text, paragraphs to boxes.

The translate attribute can change the position of the element, translateX(10px) moves the x axis 10 units, and if it is negative, it moves in the opposite direction.

Similarly, translateY can achieve a displacement along the Y axis;transform:translate(-50%,-50%) means to move the element along the x axis by 50% of its width (negative opposite direction) and then along the y axis by 50% of its height (negative opposite direction).

examples

.verticalcenter{ position: relative; top: 50%; -webkit-transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%);} The above is "how to use transform vertical alignment of css" all the content of this article, thank you for reading! I believe that everyone has a certain understanding, hope to share the content to help everyone, if you still want to learn more knowledge, welcome to pay attention to the industry information channel!

Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.