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

This article will explain in detail how to achieve absolute positioning elements in css. The editor thinks it is very practical, so I share it with you as a reference. I hope you can get something after reading this article.

Absolute positioning element

When an element is set to absolute positioning, its top, right, bottom, and static values refer to the distance from the nearest non-positioning element. The classical way of vertical centering is realized by using the negative margin of the absolute positioning element.

.wrap4 {position:relative;margin:10px;width:200px;height:200px;border:dashed 1px orange;}. Wrap4 .content {position:absolute;width:100px;height:100px;top:50%;left:50%;margin-top:-50px;margin-left:-50px;background:orange;}

Set the element to absolute positioning, and then set top and left to 50%. At this time, the upper and left side of the element will reach 50% of the parent element, and then set a negative margin of its own height and length to move the center of the element to the center of the parent element to achieve center alignment.

This is the end of this article on "how to achieve absolute positioning elements in css". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, please share it for more people to see.

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.