Vertically Align Div in Center of page

Posted on 2009-04-30
Medium Priority
Last Modified: 2012-05-06

I have created a holding page for a website which consists of a 900x550px div positioned on a black body background. I have managed to achieve horizontal centralising by specifying the width in the CSS and then applying automatic margins, but I also wish to align the div centrally vertically as well.

This is my current HTML structure:

<div id="container"></div>

The 'container' div is what i want aligning centrally vertically. Does anybody know of a CSS method that will achieve this?

Question by:rob22888

Expert Comment

ID: 24268725

For information on vertical aligning, look at the following site.
Method 1 seems to apply here.

LVL 43

Accepted Solution

David S. earned 1500 total points
ID: 24273360
Since you're using a fixed height, you could also use this technique: http://www.search-this.com/2008/05/15/easy-vertical-centering-with-css/

Featured Post

Concerto Cloud for Software Providers & ISVs

Can Concerto Cloud Services help you focus on evolving your application offerings, while delivering the best cloud experience to your customers? From DevOps to revenue models and customer support, the answer is yes!

Learn how Concerto can help you.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Today, the web development industry is booming, and many people consider it to be their vocation. The question you may be asking yourself is – how do I become a web developer?
The first step to building an amazing About page is to figure out what you want the page to say about your company. You then must grab the attention of the reader, boast a bit, tell a story and let others brag about you. With a little bit of thought…
In this tutorial viewers will learn how add a scalable full-width header using CSS3. Create a new HTML document with an internal stylesheet. Set a tiled background.:  Create a new div and name it Header. Position it with position:absolute at the top…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…
Suggested Courses
Course of the Month16 days, 17 hours left to enroll

862 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question