CODEWITHSUNDEEP
htmlcsstwitter-bootstrap
Amit
Amit

Reputation: 1

Bootstrap row not aligning to right side of container

This is driving me nuts and it seems like the solution is a simple one I am overlooking. I have a row of three images and it is my understanding that takes care of the alignment of content.

Shouldn't the third image be aligned to the right side of the container with all three being equally spaced?

http://codepen.io/amits/pen/oxbjmd?editors=1100

<div class="row">
<div class="col-md-4">
  <img src="">
</div>
<div class="col-md-4">
  <img src="">
</div>
<div class="col-md-4">
  <img src="">
</div>
</div>

what am I missing?

Upvotes: 0

Views: 135

Answers (1)

dippas
dippas

Reputation: 60603

you are missing the .container, and .img-responsive in img tag, plus you can have .col-sm-* for small devices and .col-xs-* for extra small devices.

added .col-xs-4 just for demo

take a look at the Docs

.container {
  border: red solid
}
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" />
<div class="container">
  <div class="row">
    <div class="col-xs-4 col-md-4">
      <img class="img-responsive" src="//lorempixel.com/1200/900">
    </div>
    <div class="col-xs-4 col-md-4">
      <img class="img-responsive" src="//lorempixel.com/1200/900">
    </div>
    <div class="col-xs-4 col-md-4">
      <img class="img-responsive" src="//lorempixel.com/1200/900">
    </div>
  </div>
</div>

Upvotes: 1

Related Questions