Css vertical center:

Css vertical center:

　　

1. For rows that can be processed, set height: retrial; line-height: retrial;

 

2. For a paragraph of text (multiple lines are displayed)
-> 2.1 If yes, you can set a fixed height
The parent element uses display: table; height: retrial; The child element uses display: table-cell; vertical-align: middle;

Note: the vertical-align attribute is only valid for some html elements. Specifically, the (X) HTML tag with the valign attribute is used.

For example, is basically effective for inline-block elements (inline elements ).

-> 2.2 If a height is not fixed
Set up the same inner pad-top: retrial; padding-bottom: retrial;

-> 2.3 using csshack to support ie6 vertical center comprehensive consideration of table-cell multi-layer nesting
Div # wrap {
Display: table;
Border: 1px solid # FF0099;
Background-color: # FFCCFF;
Width: 760px;
Height: 400px;
_ Position: relative;
Overflow: hidden;
}

Div # subwrap {
Vertical-align: middle;
Display: table-cell;
_ Position: absolute;
_ Top: 50%;
}

Div # content {
_ Position: relative;
_ Top:-50%;
}

Reference: http://www.zhangxinxu.com/wordpress/2010/05/%E6%88%91%E5%AF%B9css-vertical-align%E7%9A%84%E4%B8%80%E4%BA%9B%E7%90%86%E8%A7%A3%E4%B8%8E%E8% AE %A4%E8%AF%86%EF%BC%88%E4%B8%80%EF%BC%89/