How can we align text or images vertically in the center when Div layout?

I. dummies In a top-padding value for div, set the value to self-try. 2. center a single line of content It is easiest to consider a single row. No matter whether or not the container is given a fixed height, you only need to set the line-height and height for the container and make the two values equal, plus over-flow: hidden is enough. . Middle-demo-1 { Height: 4em; Line-Height: 4em; Overflow: hidden; } Advantages: 1. Both block-level and inline polar elements are supported. 2. Support for all browsers Disadvantages: 1. Only one row can be displayed 2. the center of is not supported in IE. 3. Centered multi-line content with variable container height It is also very easy to give consistent padding-bottom and padding-top. . Middle-demo-2 { Padding-top: 24px; Padding-bottom: 24px; } Advantages: 1. Both block-level and inline polar elements are supported. 2. Supports non-text content 3. Support for all browsers Disadvantages: Container cannot be fixed height