How to keep an image centered and responsive?

Question

I have an image, centered both, horizontally and vertically

#logo01{
    position:absolute;
    top:50%;
    left:50%;
    margin-top:-146px;  // half of hei         


        

Answer 1

try this

http://jsfiddle.net/hAH6u/2/

#logo01{
    position:absolute;
    top:50%;
    left:50%;   
    cursor:pointer;
    max-width:45%;
    max-height:45%;
    display:table;
}