Bootstrap center image

Question

I am trying to center an image on my webpage. I want it to appear just above my footer. No matter what I have tried so far nothing works here is my html

 <div class="center-block">  
   <img alt="footer" title="footer"  class="image-footer" src="./img/demo.png"/>
   </div>
   <div class="navbar-fixed-bottom footer"> <ul class="foot-left">
          <li><a href="#" class="menu_buttons" >Home</a></li>
           <li><a href="#" class="menu_buttons" >About</a></li>
          <li><a href="#" class="menu_buttons" >Support</a></li>
         </ul>
    <ul class="foot-right">
        <li><a href="#" class="menu_buttons" >Powered by Demo</a></li>
    </ul>

    </div>

and the image-footer class is :

 .image-footer
  {

   position:absolute;
   top:680px;
  }

no result so far. I have tried every possible combination that I know... Please advice....

Answer 1

Basics ?

<div class="text-center">
    <img alt="footer" src="./img/demo.png"/>
</div>

Answer 2

.center-block {
  width: 100%;
}
image-footer {
  width: 30%;
  margin: 0 auto;
}

make sure the parent elements also have a width of 100% (e.g. html,body..)

Answer 3

.center-block{
text-align: center;
}

Does it work now?