Бутстрап-колонны не работают

Я новичок в этом, и я пытаюсь разместить две фотографии бок о бок в строке начальной загрузки, но столбцы, похоже, не работают. Что я делаю не так? Спасибо заранее за любую помощь!Бутстрап-колонны не работают

<div class="row" style="width: 100%"> 
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6"> 
    <img src="https://heavyeditorial.files.wordpress.com/2016/02/david-joseph.jpg?quality=65&strip=all&strip=all/200x200" class="img-thumbnail img-responsive" alt="David Joseph"> 
    <p class="caption">David Joseph was unarmed when he was fatally shot by Austin police. <em>Photo credit: APD</em></p> 
</div> 
<div class="col-xs-12 col-sm-6 col-md-6 col-lg-6"> 
    <img src="http://assets.nydailynews.com/polopoly_fs/1.2523996.1454945162!/img/httpImage/image.jpg_gen/derivatives/article_400/observer9n-3-web.jpg" class="img-thumbnail img-responsive" alt="Antronie Scott"> 
    <p class="caption">San Antonio police fatally shot Antronie Scott, who was also unarmed. <em>Photo credit: SAPD</em></p></div> 
</div>

источник

2016-04-27 ERM

где вы закрывающий тег DIV для строки и почему вы используете ширину: 100%? –

добавьте jsfiddle, нам проще отредактировать код :) –

https://jsfiddle.net/#&togetherjs=LLL9w4hbrT – ERM

<div class="col-xs-12"> 
<div class="col-xs-6"> 
    <img src="https://heavyeditorial.files.wordpress.com/2016/02/david-joseph.jpg?quality=65&strip=all&strip=all/200x200" class="img-thumbnail img-responsive" alt="David Joseph"> 
    <p class="caption">David Joseph was unarmed when he was fatally shot by Austin police. <em>Photo credit: APD</em></p> 
</div> 
<div class="col-xs-6"> 
    <img src="http://assets.nydailynews.com/polopoly_fs/1.2523996.1454945162!/img/httpImage/image.jpg_gen/derivatives/article_400/observer9n-3-web.jpg" class="img-thumbnail img-responsive" alt="Antronie Scott"> 
    <p c-lass="caption">San Antonio police fatally shot Antronie Scott, who was also unarmed. <em>Photo credit: SAPD</em></p></div> 
</div> 
</div>

Если вы не счастливы с 12-Col сетке, вы можете настроить его на любое другое значение здесь: http://getbootstrap.com/customize/

Прокрутка вниз «системы сетки», изменение ваших потребностей, прокрутите вниз, скомпилируйте и загрузите свой собственный бутстрап;)

источник

2016-04-27 20:06:53 Steffomio

Вам нужно указать те же классы столбцов CSS для всех вариантов.

Ваша попытка иметь col-xs-12 в списке, изменить ее на col-xs-6.

В принципе, каждая строка имеет в общей сложности 12 столбцов, и вы хотите, чтобы их разделили поровну с каждым div, занимающим ширину столбца 6 в вашем случае.

источник

2016-04-27 21:09:56

Я думал, что мне понадобится 12 столбцов в xs и 6 в других. Почему картинки не меняются с изменением размера экрана? – ERM

Для изображений, которые нужно добавить класс внутри тега изображения «IMG-реагирующих» :)

источник

2016-04-28 05:11:37

Это может работать для того, что вы пытаетесь сделать:

<div class="container"> 
    <section class="row"> 
     <div class="col-md-6"> 
      <img src="https://heavyeditorial.files.wordpress.com/2016/02/david-joseph.jpg?quality=65&strip=all&strip=all/200x200" class="img-thumbnail img-responsive" alt="David Joseph"> 
      <p class="caption">David Joseph was unarmed when he was fatally shot by Austin police. <em>Photo credit: APD</em></p> 
     </div> 
     <div class="col-md-6"> 
      <img src="http://assets.nydailynews.com/polopoly_fs/1.2523996.1454945162!/img/httpImage/image.jpg_gen/derivatives/article_400/observer9n-3-web.jpg" class="img-thumbnail img-responsive" alt="Antronie Scott"> 
      <p class="caption">San Antonio police fatally shot Antronie Scott, who was also unarmed. <em>Photo credit: SAPD</em></p></div> 
     </div> 
    </section> 
</div>

источник

2016-04-28 05:27:49 slickset

Бутстрап-колонны не работают

ответ

Смежные вопросы