-3

I would like to horizontally and vertically align the following div to the centre of the page. I have managed to horizontally align it to the centre; however, not vertically. How can I do this?

http://www.brennanpringle.com/cat.html

X '
  • 7
  • 1
  • Welcome to StackOverflow! Please be sure to read our [ask] page to help you formulate a great question. You are much more likely to get a good answer from the community if you put some effort into your question. – blurfus Aug 13 '15 at 22:56
  • Please add meaningful code and a problem description here. Don't just link to the site that needs fixing - otherwise, this question will lose any value to future visitors once the problem is solved. Posting a [Short, Self Contained, Correct Example (SSCCE)](http://www.sscce.org/) that demonstrates your problem would help you get better answers. For more info, see [Something on my web site doesn't work. Can I just paste a link to it?](http://meta.stackexchange.com/questions/125997/) Thanks! – j08691 Aug 13 '15 at 22:56
  • possible duplicate of [How to vertically align divs?](http://stackoverflow.com/questions/2743989/how-to-vertically-align-divs) – Kevin Boucher Aug 13 '15 at 23:09

1 Answers1

3

Add these top:0;right:0;bottom:0;left:0;margin:auto; to your .circle

.circle {
    background: rgba(0, 0, 0, 0) url("http://www.brennanpringle.com/images/image.jpg") no-repeat scroll center center;
    border-radius: 150px;
    bottom: 0;
    height: 200px;
    left: 0;
    margin: auto;
    position: absolute;
    right: 0;
    top: 0;
    width: 200px;
}
joyBlanks
  • 6,419
  • 1
  • 22
  • 47