Как сделать карточки товара одинаковыми по высоте?

Question

[Никита]

Всем привет, первый раз верстаю сайт, уже какой день не могу решить след проблемы:
1. Карточки товара разные по высоте , хочется что бы цена и кнопка были всегда с низу
2. Когда открываю сайт с телефона во всех браузерах отображается другой шрифт,а на компе все ок
3.Когда на моб устройстве происходит скролл с бургер меню,оно не закрывается автоматом.

Залил на хостинг, можно посмотреть по ссылке:
creamcake.mcdir.ru

буду очень благодарен за помощь )

код:

Answer 1

[Антон Литвиненко]

$('.menu a').on('click', function(e) {
	e.preventDefault();
	if ($('.header__menu').hasClass('open')) {
		$('.menu').removeClass('show');
		$('.header__burger').removeClass('active');
		$('.header__menu').removeClass('open');
	}
});

Но так как у вас там прокрутка до якорей, то может дописать в ту функцию.

С карточками я поступил бы так, исходя из разметки

.card {
	height: calc(100% - 2rem);
}

.card__body {
	flex-grow: 1;
	display: flex;
	flex-direction: column;
}

и потом отбить маргином вверх то что нужно прибить к низу - цену и кнопку

Comments

[Юрий]

Чтобы не городить height: calc(...), можно просто вертикальные маргины с .card убрать, они там нафиг не нужны. Цену и кнопку придётся завернуть в отдельный div, иначе их тоже выстроит в столбик. В итоге по карточкам получается что-то такое:



Шрифты в мобильнике вроде на месте, через browserstack смотрел.

[Антон Литвиненко]

Юрий, все верно говорите, но я писал так, как будто у меня есть возможность только дописывать css)
Так то если присмотреться, то я бы и паддинги в заголовках на маргины поменял и ещё много чего

[Никита]

Антон Литвиненко, спасибо огромное , скрипт решил проблему с закрыванием бургера)

[Никита]

Юрий, Вам спасибо за карточки , теперь то что надо!
да, шрифт вроде на месте ,но в сафари открывается какой то не понятный с засечками


еще хочу сделать чтобы при нажатии на + в карточке товара всплывало модальное окно, подскажите это нудно для каждого торта писать отдельное или можно как то сделать проще?