Problem with div (columns)

Navigation
0

I am modifying a page created by a partner. The problem is that before I had 2 columns and 1 single row. There are only images there. So I have the code. 

        <div class="row oo">

                <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"><div class="inner-img"><img src="img/imagen-1.jpg"></div></div>
                <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"><div class="inner-img"><img src="img/imagen-2.jpg"></div></div>
        </div>
        <div class="row oo">

            <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"><div class="inner-img"><img src="img/imagen-3.jpg"></div></div>
            <div class="col-xs-12 col-sm-12 col-md-6 col-lg-6"><div class="inner-img"><img src="img/imagen-4.jpg"></div></div>
        </div>

The problem is that I only see one image, per row, and 2 images per row would have to appear in each column.

    
asked by lucasdgordillo 23.03.2017 в 15:27
source

1 answer

1

I do not know the resolution of your screen, but remember that bootstrap works through a grid system that has 12 columns, in addition to this you have defined your breakpoints between resolution and resolution, so if your screen is small and enter between the resolutions of the classes xs or sm, you have defined that occupy the 12 columns each image and as there are no more columns that follows puts it below. Then you can tell it to be 6 and 6 only and the two would fit in a single row. 

img{
  width:100%;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<div class="row oo">

  <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
    <div class="inner-img"><img src="http://www.infotechnology.com/export/sites/revistait/img/internet/2015/07/21/epictierra.png_765980715.png"></div>
  </div>
  <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
    <div class="inner-img"><img src="http://www.infotechnology.com/export/sites/revistait/img/internet/2015/07/21/epictierra.png_765980715.png"></div>
  </div>
</div>
<div class="row oo">

  <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
    <div class="inner-img"><img src="http://www.infotechnology.com/export/sites/revistait/img/internet/2015/07/21/epictierra.png_765980715.png"></div>
  </div>
  <div class="col-xs-6 col-sm-6 col-md-6 col-lg-6">
    <div class="inner-img"><img src="http://www.infotechnology.com/export/sites/revistait/img/internet/2015/07/21/epictierra.png_765980715.png"></div>
  </div>
</div>
    
answered by 23.03.2017 в 15:41
Accessing nested elements in a JSON from a Django template this.lastID returns null when I make a bind in the callback of a db.run () - NodeJS