Nikulio
@Nikulio
NaN !== NaN

Как выровнять блоки с фото?

Всем привет

Есть такой трабл - joxi.ru/Y2Le7y9UGW58A6;
На сайте много таких блоков, вот HTML:

<a class="ajax-elem grid-search-result f-left" href="/sunglasses/0012s003_50/">
					<figure class="images-block">
						<img src="/content/shop/item_16770.jpg" alt="0012S-003 50">
						<div class="overlay"></div>
						<div class="sell-grid">- 30%</div>
				</figure>
					<div class="info-block cf">
						<div class="left-column f-left">
							<div class="brand">Bottega Veneta</div>
							<div class="article">
								0012S-003 50
							</div>
						</div>
						<div class="right-column f-right">
							<div class="price">8 665 грн.</div>
							<div class="old-price">12 379 грн.</div>
						</div>
					</div>
				</a>


И css:

.block-result {
  padding-right: 20px;
  background: #f3f3f3;
  font-size: 0;
  line-height: 0;
  text-align: left;
}
.block-result .grid-search-result {
  background: #f3f3f3;
  width: 20%;
  -webkit-transition: background 0.5s ease;
  -moz-transition: background 0.5s ease;
  -o-transition: background 0.5s ease;
  transition: background 0.5s ease;
  float: none;
  display: inline-block;
}
.block-result .grid-search-result .images-block {
  margin: 0;
  font-size: 0;
  line-height: 0;
  text-align: center;
  background: #ffffff;
}
.block-result .grid-search-result .images-block img {
  width: 65%;
  height: auto;
}
.block-result .grid-search-result .sell-grid,
.block-result .grid-search-result .new-grid {
  top: 0;
  right: 0;
}
.block-result .grid-search-result .info-block {
  padding: 0 20px 15px;
  height: 78px;
}
.block-result .grid-search-result .info-block .article {
  color: #6e6966;
  font-size: 10px;
  line-height: 16px;
}
.block-result .grid-search-result .info-block .brand {
  font-size: 14px;
  line-height: 16px;
  margin-bottom: 5px;
}
.block-result .grid-search-result .info-block .price {
  font-size: 14px;
  line-height: 16px;
  margin-bottom: 5px;
  color: #d1ab66;
}
.block-result .grid-search-result .info-block .old-price {
  color: #6e6966;
  position: relative;
  font-size: 10px;
  line-height: 16px;
}
.block-result .grid-search-result .info-block .old-price:before {
  content: "";
  height: 1px;
  position: absolute;
  top: 49%;
  width: 71%;
  background: #6e6966;
}
.block-result .grid-search-result .overlay {
  backface-visibility: hidden;
  background: #000;
  left: 0;
  top: 0;
  opacity: 0.05;
  position: absolute;
  -webkit-transition: opacity 0.3s ease 0s;
  -moz-transition: opacity 0.3s ease 0s;
  -o-transition: opacity 0.3s ease 0s;
  transition: opacity 0.3s ease 0s;
  width: 100%;
  height: 100%;
}
.block-result .grid-search-result:hover {
  background: rgba(255, 255, 255, 0.5);
}
.block-result .grid-search-result:hover .overlay {
  opacity: 0.03;
}


Вопрос: как их подравнять "как один"?Фото грузятся в 600х600, потом равняются
Спасибо
  • Вопрос задан
  • 137 просмотров
Пригласить эксперта
Ответы на вопрос 1
Bellicus
@Bellicus
И швец, и жнец, и на дуде игрец.
нужные_блоки {
    display: inline-block;
    vertical-align: top;
}
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Похожие вопросы