Change height of listing card

General
3

For those that might be looking for a solution I think I came up with one. I’m no CSS expert so feel free to modify it to your liking and post here if you come up with something better.


@media only screen and (max-width: 600px) {
	article.hp-listing-category.hp-listing-category--view-block {
		height: auto;
		padding-top: 15%;
 }
}

@media only screen and (min-width: 601px) and (max-width: 767px) {
	article.hp-listing-category.hp-listing-category--view-block {
		height: 20rem;
		padding-top: 35%;
 }
}

@media only screen and (min-width: 768px) and (max-width: 900px) {
	article.hp-listing-category.hp-listing-category--view-block {
		height: 20rem;
		padding-top: 75%;
 }
}

@media only screen and (min-width: 901px) {
	article.hp-listing-category.hp-listing-category--view-block {
		min-height: 20rem;
		max-height: 24rem;
		padding-top: 75%;
 }
}

 @media only screen and (min-width: 600px) and (max-width: 900px) {
	.hp-listing-category__name {
		font-size: 1.35rem;
 }
}

/* Remove listing category description */
.hp-listing-category__description {
	display: none;
}
3 Likes