Показать спрайт, содержащий изображения разных размеров с одинаковым размером - PullRequest
0 голосов
/ 05 июля 2018

Я использую изображение спрайта в своем приложении. Имеет изображения флагов разного размера, высоты и ширины. Но я должен отобразить все изображения флагов с одинаковым размером в моей сетке. В настоящее время они отображаются с различными размерами

<div ng-repeat="i in arr">
  <img class="img-{{i.id}}" /> {{i.name}}
</div>
var arr = [{
    id: 1,
    name:: test1
  },
  {
    id: 2,
    name:: test2
  },
  {
    id: 3,
    name:: test3
  },
  {
    id: 4,
    name:: test4
  }
]

CSS

.img-1 {
  width: 810px;
  height: 540px;
  background: url('./../images/sprite.png') -12530px -4970px;
}

.img-2 {
  width: 1200px;
  height: 600px;
  background: url('./../images/sprite.png') -10390px -3730px;
}

.img-3 {
  width: 320px;
  height: 320px;
  background: url('./../images/sprite.png') -8780px -8030px;
}

.img-4 {
  width: 1000px;
  height: 500px;
  background: url('./../images/sprite.png') -4718px -11840px;
}

Как отобразить все флаги одинакового размера по высоте и ширине?

...