В пункте 4 написано :
Изображениям в блоках .catalog-item задайте максимальную ширину 100% и высоту со значенем auto.
<div class="popular-and-price">
<div class="container">
<h2 class="section-title">Популярные товары</h2>
<a class="btn" href="#" title="Посмотреть все товары">Каталог</a>
<div class="popular-items">
<div class="catalog-item">
<img src="img/glasses-1.jpg" alt="очки «Классика жанра»" width="100%" height="auto">
<h3>Очки «Классика жанра»</h3>
<b class="catalog-item-price">300 р.</b>
<a href="#" class="btn btn-info">Описание</a>
<a href="#" class="btn btn-buy">Купить</a>
</div>
<div class="catalog-item">
<img src="img/glasses-2.jpg" alt="очки «Жалюзи»" width="100%" height="auto">
<h3>Очки «Жалюзи»</h3>
<b class="catalog-item-price">400 р.</b>
<a href="#" class="btn btn-info">Описание</a>
<a href="#" class="btn btn-buy">Купить</a>
</div>
<div class="catalog-item">
<img src="img/glasses-3.jpg" alt="очки «Базилис»" width="100%" height="auto">
<h3>Очки «Базилис»</h3>
<b class="catalog-item-price">500 р.</b>
<a href="#" class="btn btn-info">Описание</a>
<a href="#" class="btn btn-buy">Купить</a>
</div>
</div>
Картинки меняют свое положение, все как в коде все работает.
Но браузер почему то не пропускает.
Я пробовал из IMG убрать и добавить в CSS код, все равно он не пропускает, хотя картинки спокойно меняются ?? WTF
Так же картинки не встают в один ряд,