Centering a Div Both Horizontally And Vertically

April 7, 2010

While building web page layouts, you’ve probably been faced with a situation where you need to center a div both horizontally and vertically with pure CSS. There are more than a few ways to achieve this, and in this article we are going to show you our favorite involving CSS and jQuery. But first, the basics: Horizontal centering with CSS .className{ margin:0 auto; width:200px; height:200px; } To center a div only horizontally, you need to specify a width, and an auto value for the left and right margins . This... [Read the full story]