Как найти нужное значение в gap?

Question

[San Manjiro]

У меня есть код

grid-template-columns: 355px clamp(290px, 22vw, 435px);

и нужно чтобы по дефолту размер второго столбца был 435px, а дальше только уменьнался до 290px, как подобрать середину? Как самому задать именно тот порог, от которого уже будет уменьшатся столбец?

Comments

[Антон Антон]

minmax(290px, 435px)?

[San Manjiro]

Антон Антон, не работает, второй столбец просто не уменьшается, я вопрос задаю в общем, потому что если брать уже не гриды, а допустим with, то там уже нет minmax(), там только clamp и вот как описаную мною ситуация разрулить в with? Раньше делал все через @media, но недавно наткнулся на такие функции как clamp(), min(), max(), в голове просто не укладывается как это работает и все, не воспринимается. Все понимаю, а этого элементарного понять не могу...

[Антон Антон]

San Manjiro, уменьшается, см. пример в ответе

Answer 1

[Сергей delphinpro]

Подбирайте среднее значение (22vw)
Его можно высчитать. Например, блок должен начать уменьшаться на ширине экрана в 1000px. Единица изменения vw есть не что иное как процент от ширины экрана.
Значит нужно посчитать процент 435 от 1000. Это будет 43.5%.
Итого

.s {
  grid-template-columns: 355px clamp(290px, 43.5vw, 435px);
}

Comments

[San Manjiro]

да, это то объяснение, которое мне было нужно, спасибо )

Answer 2

[Антон Антон]

minmax(290px, 435px)
https://codepen.io/FragsterAt/pen/OJeXZJN