CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
ElGatoSaez
ElGatoSaez

Reputation: 33

img-responsive doesn't center

I need some help.
img-responsive doesn't centers with this code.

div.container-main {
    margin-left: auto; 
    margin-right: auto; 
    text-align: center;
}

Then the HTML code is this one

  <div class="container-main">  
  <section class="main">
        <img class="img-responsive" src="img/bio.png" alt="Microscópio Óptico">
  </section>

Any help? I've already seen this one but didn't worked for me.
Without img-responsive it's working excellent.
I'm using Bootstrap.

Upvotes: 3

Views: 417

Answers (1)

Pouya Ataei
Pouya Ataei

Reputation: 2169

This is a pleasantly easy fix. Because .img-responsive from Bootstrap already sets display: block, you can use margin: 0 auto to center the image:

.img-responsive {
    margin: 0 auto;
}

Upvotes: 1

Related Questions