Sưu tầm

Centering elements vertically with css is something that often gives designers trouble. There are however a variety of methods for vertical centering and each is fairly easy to use. Today I want to present 6 of those methods. I’ve usually skipped over the topic of vertical centering, since there are some good posts already out there that are easy enough to find, but recently Bikram commented requesting a tutorial on vertically centering so I thought why not. You can view demos of each of the methods below by clicking here . Clicking the images above each section will also take you to that specific demo. Let’s start by first talking about something that doesn’t work as many expect. Understanding why vertical-align doesn’t always work will help us better understand vertical centering in general. Vertical-Align Horizontal centering with css is rather easy. When the element to be centered is an inline element we use text-align center on its parent. When the element i