JSFiddle - React, Tailwind, and code Playground

by Stas Orekhovskiy

CSS

/* 
 - Так как при загрузке страницы, сначала прогружается html, а только после подгружаются ваши картинки, то:
 - Для тумб я добавил во этот код, так как если я задам картинке просто высоту 100%, то это ничего не изменит.
 - По этому нужно дабавлять фиксированные размеры! 
*/
.th img,.th-small img{
	width: 100%;
}
@media all and (max-width: 1350px) {
	.th img{height: 180px;}
	.th-small img{height: 143px;}
}
@media all and (max-width: 1250px) {
	.th img{height: 170px;}
}
@media all and (max-width: 1150px) {
	.th img{height: 165px;}
	.th-small img{height: 130px;}
}
@media all and (max-width: 1100px) {
	.th img{height: 160px;}
}
@media all and (max-width: 1050px) {
	.th img{height: 155px;}
	.th-small img{height: 125px;}
}
@media all and (max-width: 1024px) {
	.th img{height: 180px;}
	.th-small img{height: 143px;}
}
@media all and (max-width: 950px) {
	.th img{height: 175px;}
	.th-small img{height: 130px;}
}
@media all and (max-width: 900px) {
	.th img{height: 170px;}
	.th-small img{height: 125px;}
}
@media all and (max-width: 850px) {
	.th img{height: 160px;}
	.th-small img{height: 115px;}
}
@media all and (max-width: 800px) {
	.th img{height: 180px;}
	.th-small img{height: 143px;}
}
@media all and (max-width: 750px) {
	.th img{height: 175px;}
	.th-small img{height: 130px;}
}
@media all and (max-width: 700px) {
	.th img{height: 165px;}
	.th-small img{height: 143px;}
}
@media all and (max-width: 650px) {
	.th img{height: 155px;}
}
@media all and (max-width: 600px) {
	.th img{height: 145px;}
}
@media all and (max-width: 550px) {
	.th img{height: 135px;}
	.th-small img{height: 130px;}
}
@media all and (max-width: 540px) {
	.th img{height: 180px;}
	.th-small img{height: 120px;}
}
@media all and (max-width: 480px) {
	.th img{height: 170px;}
	.th-small img{height: 143px;}
}
@media all and (max-width: 440px) {
	.th img{height: 160px;}
	.th-small img{height: 130px;}
}
@media all and (max-width: 400px) {
	.th img{height: 145px;}
	.th-small img{height: 125px;}
}
@media all...