Home  >  Article  >  Web Front-end  >  How to center horizontally and vertically absolutely positioned elements

How to center horizontally and vertically absolutely positioned elements

高洛峰
高洛峰Original
2017-02-24 13:35:071189browse

This article mainly introduces the method of horizontal and vertical centering of absolutely positioned elements. There are 3 methods for reference. Friends who need it can take a look.

1.css to achieve centering

Disadvantages: Need to know the width and height of the element in advance.




    
    Document
    

2. CSS3 achieves horizontal and vertical centering

Note: Regardless of the size of the element Whatever it is, it can be centered. However, this writing method is only compatible with IE8 and above, and can be ignored on mobile terminals.




    
    Document
    

3. Margin: auto to achieve centering




    
    Document
    

More For related articles on horizontal and vertical centering methods of absolutely positioned elements, please pay attention to the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn