панель автозаполнения поиска в угловых JS

Question

Я пытаюсь сделать img в моем div отзывчивым.Я также хотел бы, чтобы изображения отображались как 3 подряд для максимального размера экрана.

index.html

.container {
border: 1px solid #333;
border-radius: 8px;
background-color: #fff;
margin:5px;
padding:5px;
height:auto;
width:auto;    
}

img {
  max-height: auto;
  max-width: auto;
}

<div class="container">
        <div class="col-sm-4"  ng-repeat="hbl in hbls"></div>
           <a href ng-repeat="h in hbl.data_list"><img ng-src="{{h.img}}" 
                 alt="" >
                  {{n.name}} </a>
        </div>
     </div>

Answer 1

1. У вас нет необходимости </div>
2. Если вы хотите for maximum screen size, вам нужно установить col-lg-4 и НЕ col-sm-4, потому что sm для наименьшего размера экрана и не максимум

.container {
border: 1px solid #333;
border-radius: 8px;
background-color: #fff;
margin:5px;
padding:5px;
height:auto;
width:auto;    
}

img {
  max-height: auto;
  max-width: auto;
}

<div class="container">
        <div class="col-lg-4"  ng-repeat="hbl in hbls"></div>
           <a href ng-repeat="h in hbl.data_list">
           <img src="https://material.angular.io/assets/img/examples/shiba1.jpg" 
                 alt="" >
                  Name</a>
</div>