У меня есть блок создан с помощью grid
который при уменьшении ширины сайта не уменьшается как верхний блок.
CSS код:
.storehouse {
display: grid;
grid-template-columns: min-content
min-content min-content min-content;
grid-template-rows: min-content
min-content min-content;
justify-content: center;
}
.storehouse__photo {
display: block;
height: 100%;
width: 100%;
}
.storehouse__item-1 {
grid-column: 1 / 1;
grid-row: 1 / span 2;
min-width: 560px;
min-height: 500px;
position: relative;
}
.storehouse__item-2 {
grid-column: 1 / span 2;
grid-row: 3 / 3;
min-width: 800px;
min-height: 280px;
position: relative;
}
.storehouse__item-3 {
grid-column: 2 / span 3;
grid-row: 1 / 1;
min-width: 880px;
min-height: 280px;
position: relative;
background: #5d257c;
}
.storehouse__item-4 {
grid-column: 2 / 2;
grid-row: 2 / 2;
max-width: 140px;
min-height: 302px;
max-height: 314px;
background: #fff;
position: relative;
}
.storehouse__item-5 {
grid-column: 3 / 3;
grid-row: 2 / span 3;
min-width: 680px;
}
.storehouse__item-6 {
grid-column: 4 / 4;
grid-row: 1 / 1;
min-width: 653px;
min-height: 280px;
position: relative;
}
.storehouse__item-7 {
grid-column: 4 / 4;
grid-row: 2 / span 3;
min-width: 680px;
min-height: 600px;
position: relative;
}