Css style setting height undefined text vertical center

Using css to implement vertical text center is easier for browsers that support display: table. You only need to set the external layer div to table and the inner layer div to table-cell, set the vertical center of the text. However, for IE6/7, display: table is not supported. You can only use the location method for processing. The outer div gives a positioning. The middle div is absolutely positioned relative to the outer layer. The top is 50%, the inner span is relatively positioned, and the top is-50%. The content is vertically centered through the positioning of plus and minus 50%.

Related DEMO code (no matter how div1 height is changed, the content can be vertically centered with no limit to the number of lines ):

In ie, vertical center IE6/7 uses the positioning relationship to vertical center, and IE8/9 uses the display: table and display: table-cell