View Full Version : Help with centering div using css

05-24-2010, 05:08 PM
I have a website I am working on and am attempting to center horizontally and vertically a hidden div element so that it is always centered. any ideas?

<style type="text/css">
#layer1 {
position: fixed;
visibility: hidden;
width: auto;
background-color: #ffffff;
border: 1px solid #000;
padding: 10px;
margin-left: 150px;
margin-right: 150px;


#close {
float: right;

<div id="layer1">

05-24-2010, 06:28 PM
To horizontally center the DIV element you need to give the DIV a defined width, and then you can add margin: 0 auto; which basically means it automatically calculates the left and right margin to center the element.

Vertically centering the element is a bit tricker, because of Internet Explorer, but I suggest you take a read of this (http://www.jakpsatweb.cz/css/css-vertical-center-solution.html) for a bit more information on how it can be done.

05-24-2010, 08:26 PM
There is some help here. (http://exitfegs.co.uk/Sources.html) Use the search facility.

More to the point

Specifically here. (http://www.wpdfd.com/editorial/thebox/deadcentre4.html)


05-25-2010, 12:12 AM
I like this method - http://nopeople.com/CSS/vertical%20center%20with%20CSS/page4.html